Fixes footer element handling, Fixes style bugs

parent 954e4a26
......@@ -126,6 +126,13 @@ export const appRoutes: Routes = [
NgbModule.forRoot(),
Angulartics2Module.forRoot([ArsnovaClickAngulartics2Piwik]),
I18nManagerModule,
JwtModule.forRoot({
jwtOptionsProvider: {
provide: JWT_OPTIONS,
useFactory: jwtOptionsFactory,
deps: [StorageService],
},
}),
],
providers: [
/* {
......
import { isPlatformBrowser } from '@angular/common';
import { Inject, Injectable, PLATFORM_ID } from '@angular/core';
import { EventEmitter, Inject, Injectable, PLATFORM_ID } from '@angular/core';
import { FooterbarElement } from '../../../lib/footerbar-element/footerbar-element';
import { IFooterBarElement } from '../../../lib/footerbar-element/interfaces';
import { DB_TABLE, STORAGE_KEY } from '../../shared/enums';
......@@ -63,7 +63,7 @@ export class FooterBarService {
linkTarget: null,
}, function (): void {
if (document) {
document.getElementById('upload-SESSION').click();
document.getElementById('upload-session').click();
}
});
public footerElemHashtagManagement: IFooterBarElement = new FooterbarElement({
......@@ -216,8 +216,17 @@ export class FooterBarService {
showIntro: false,
}, function (): void {
});
public footerElemSaveQuiz: IFooterBarElement = new FooterbarElement({
id: 'saveQuiz',
iconClass: 'fas fa-save',
textClass: 'footerElementText',
textName: 'region.footer.footer_bar.save_quiz',
selectable: true,
showIntro: false,
}, function (): void {
});
public footerElemExport: IFooterBarElement = new FooterbarElement({
id: 'startQuiz',
id: 'exportQuiz',
iconClass: 'fas fa-download',
textClass: 'footerElementText',
textName: 'component.leaderboard.export',
......@@ -281,10 +290,43 @@ export class FooterBarService {
linkTarget: '/quiz/manager/memberGroup',
}, function (): void {
});
public footerElemLogin: IFooterBarElement = new FooterbarElement({
id: 'login',
iconClass: 'fas fa-sign-in-alt',
textClass: 'footerElementText',
textName: 'region.footer.footer_bar.login',
selectable: false,
showIntro: false,
linkTarget: '/login',
}, function (): void {
});
public footerElemLogout: IFooterBarElement = new FooterbarElement({
id: 'logout',
iconClass: 'fas fa-sign-out-alt',
textClass: 'footerElementText',
textName: 'region.footer.footer_bar.logout',
selectable: false,
showIntro: false,
linkTarget: '/login',
queryParams: {
logout: true,
},
}, function (): void {
});
public footerElemEditI18n: IFooterBarElement = new FooterbarElement({
id: 'edit-i18n',
iconClass: 'fas fa-language',
textClass: 'footerElementText',
textName: 'region.footer.footer_bar.edit-i18n',
selectable: false,
showIntro: false,
linkTarget: '/i18n-manager',
}, function (): void {
});
private _footerElements: Array<IFooterBarElement> = [];
private _footerElements = new EventEmitter<Array<IFooterBarElement>>();
get footerElements(): Array<IFooterBarElement> {
get footerElements(): EventEmitter<Array<IFooterBarElement>> {
return this._footerElements;
}
......@@ -292,7 +334,7 @@ export class FooterBarService {
}
public replaceFooterElements(elements: Array<IFooterBarElement>): void {
this._footerElements = elements;
this._footerElements.next(elements);
}
}
......@@ -5,6 +5,14 @@
transition: background-color 800ms linear;
}
@mixin bgAnimationEffect($theme) {
transition: background-color 800ms linear;
animation-name: #{$theme}_colorChangingBg;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-duration: 4s;
}
@mixin introjs($map) {
.introjs-helperLayer {
background-color: map-get($map, "bg-introjs-helper_layer");
......@@ -510,6 +518,17 @@
#waiting_for_players_notifier {
color: map-get($map, "fg-lobby-waiting-for-players-notifier");
}
@keyframes #{$theme}_colorChangingBg {
0% {
background-color: map-get($map, colorChangingBg0);
}
50% {
background-color: map-get($map, colorChangingBg50);
}
100% {
background-color: map-get($map, colorChangingBg100);
}
}
.own-nick {
animation: colorChangingOwnNick 5s infinite;
}
......@@ -591,138 +610,138 @@
}
@keyframes #{$theme}_colorChangingArs {
0% {
color: white;
color: map-get($map, colorChangingArs0);
}
25% {
color: map-get($map, "input-background-color");
color: map-get($map, colorChangingArs25);
}
50% {
color: white;
color: map-get($map, colorChangingArs50);
}
75% {
color: white;
color: map-get($map, colorChangingArs75);
}
100% {
color: white;
color: map-get($map, colorChangingArs100);
}
}
@keyframes #{$theme}_colorChangingNova {
0% {
color: white;
color: map-get($map, colorChangingNova0);
}
25% {
color: white;
color: map-get($map, colorChangingNova25);
}
50% {
color: map-get($map, "input-background-color");
color: map-get($map, colorChangingNova50);
}
75% {
color: white;
color: map-get($map, colorChangingNova75);
}
100% {
color: white;
color: map-get($map, colorChangingNova100);
}
}
@keyframes #{$theme}_colorChangingDot {
0% {
color: white;
color: map-get($map, colorChangingDot0);
}
25% {
color: white;
color: map-get($map, colorChangingDot25);
}
50% {
color: white;
color: map-get($map, colorChangingDot50);
}
75% {
color: map-get($map, "input-background-color");
color: map-get($map, colorChangingDot75);
}
100% {
color: white;
color: map-get($map, colorChangingDot100);
}
}
@keyframes #{$theme}_colorChangingClick {
0% {
color: white;
color: map-get($map, colorChangingClick0);
}
25% {
color: white;
color: map-get($map, colorChangingClick25);
}
50% {
color: white;
color: map-get($map, colorChangingClick50);
}
75% {
color: white;
color: map-get($map, colorChangingClick75);
}
100% {
color: map-get($map, "input-background-color");
color: map-get($map, colorChangingClick100);
}
}
@-webkit-keyframes #{$theme}_colorChangingArs {
0% {
color: white;
color: map-get($map, colorChangingArs0);
}
25% {
color: map-get($map, "input-background-color");
color: map-get($map, colorChangingArs25);
}
50% {
color: white;
color: map-get($map, colorChangingArs50);
}
75% {
color: white;
color: map-get($map, colorChangingArs75);
}
100% {
color: white;
color: map-get($map, colorChangingArs100);
}
}
@-webkit-keyframes #{$theme}_colorChangingNova {
0% {
color: white;
color: map-get($map, colorChangingNova0);
}
25% {
color: white;
color: map-get($map, colorChangingNova25);
}
50% {
color: map-get($map, "input-background-color");
color: map-get($map, colorChangingNova50);
}
75% {
color: white;
color: map-get($map, colorChangingNova75);
}
100% {
color: white;
color: map-get($map, colorChangingNova100);
}
}
@-webkit-keyframes #{$theme}_colorChangingDot {
0% {
color: white;
color: map-get($map, colorChangingDot0);
}
25% {
color: white;
color: map-get($map, colorChangingDot25);
}
50% {
color: white;
color: map-get($map, colorChangingDot50);
}
75% {
color: map-get($map, "input-background-color");
color: map-get($map, colorChangingDot75);
}
100% {
color: white;
color: map-get($map, colorChangingDot100);
}
}
@-webkit-keyframes #{$theme}_colorChangingClick {
0% {
color: white;
color: map-get($map, colorChangingClick0);
}
25% {
color: white;
color: map-get($map, colorChangingClick25);
}
50% {
color: white;
color: map-get($map, colorChangingClick50);
}
75% {
color: white;
color: map-get($map, colorChangingClick75);
}
100% {
color: map-get($map, "input-background-color");
color: map-get($map, colorChangingClick100);
}
}
.button-markdown-shadow, .button-markdown {
......
......@@ -39,6 +39,10 @@ body {
width: 50px;
}
.w-100px {
width: 100px;
}
p {
margin: 0;
......
Markdown is supported
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