Commit 936efb11 authored by Maki's avatar Maki 🌺
Browse files

Initial about page in new settings

parent 8029c9b9
<div
style="
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
"
>
<img
src="./assets/logo-dark.svg"
alt="Tivoli Cloud VR logo"
style="height: 100px"
/>
<br />
<br />
<p>
Version {{ buildVersion }}
<br />
Released {{ buildDate }}
</p>
<hr />
<br />
Built with
<div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/Qt_logo_2016.svg/1280px-Qt_logo_2016.svg.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://ypcode.files.wordpress.com/2017/08/typescript_logo_new.png?w=192);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/99/Unofficial_JavaScript_logo_2.svg/768px-Unofficial_JavaScript_logo_2.svg.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/cf/Angular_full_color_logo.svg/1200px-Angular_full_color_logo.svg.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://www.iconfinder.com/data/icons/logos-and-brands/512/97_Docker_logo_logos-512.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://avatars0.githubusercontent.com/u/6955508?s=280&v=4);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/en/thumb/f/fb/OpenGL_logo_%28Nov14%29.svg/1357px-OpenGL_logo_%28Nov14%29.svg.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/83/Steam_icon_logo.svg/1024px-Steam_icon_logo.svg.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://seeklogo.com/images/O/oculus-stadium-logo-E155003FA3-seeklogo.com.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/1/16/Simple_DirectMedia_Layer%2C_Logo.svg/766px-Simple_DirectMedia_Layer%2C_Logo.svg.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://mk0quobisjc02mt2fb6i.kinstacdn.com/wp-content/uploads/2018/08/webrtc-logo-vert-retro-255x305.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/f/f3/Chromium_Material_Icon.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/c3/Python-logo-notext.svg/600px-Python-logo-notext.svg.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/1/13/Cmake.svg/1200px-Cmake.svg.png);
"
></div>
<div
class="icon"
style="
background-image: url(https://upload.wikimedia.org/wikipedia/commons/a/a1/OpenSSL_logo.png);
"
></div>
</div>
</div>
.icon {
width: 48px;
height: 48px;
display: inline-block;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
margin: 4px;
}
import { Component, OnInit } from "@angular/core";
import { ScriptService } from "../../script.service";
@Component({
selector: "app-about",
templateUrl: "./about.component.html",
styleUrls: ["./about.component.scss"],
})
export class AboutComponent implements OnInit {
buildDate: string;
buildVersion: string;
qtVersion: string;
constructor(private readonly script: ScriptService) {}
ngOnInit(): void {
this.script.rpc<string>("About.buildDate").subscribe(buildDate => {
this.buildDate = buildDate;
});
this.script
.rpc<string>("About.buildVersion")
.subscribe(buildVersion => {
this.buildVersion = buildVersion;
});
this.script.rpc<string>("About.qtVersion").subscribe(qtVersion => {
this.qtVersion = qtVersion;
});
}
}
......@@ -2,6 +2,7 @@ import { CommonModule } from "@angular/common";
import { NgModule } from "@angular/core";
import { RouterModule, Routes } from "@angular/router";
import { MaterialModule } from "../material.module";
import { AboutComponent } from "./about/about.component";
import { CacheComponent } from "./cache/cache.component";
import { GraphicsComponent } from "./graphics/graphics.component";
import { NametagComponent } from "./nametag/nametag.component";
......@@ -50,6 +51,14 @@ const routes: Routes = [
icon: "label",
},
},
{
path: "about",
component: AboutComponent,
data: {
name: "About",
icon: "info",
},
},
],
},
];
......@@ -61,6 +70,7 @@ const routes: Routes = [
GraphicsComponent,
CacheComponent,
NametagComponent,
AboutComponent,
],
imports: [CommonModule, RouterModule.forChild(routes), MaterialModule],
})
......
......@@ -51,6 +51,15 @@
<mdc-icon mdcListItemGraphic>label</mdc-icon>
Nametag
</a>
<a
mdc-list-item
routerLink="/settings/about"
routerLinkActive="mdc-list-item--activated"
queryParamsHandling="preserve"
>
<mdc-icon mdcListItemGraphic>info</mdc-icon>
About
</a>
<!-- <mdc-list-divider></mdc-list-divider> -->
<a mdc-list-item disabled style="height: 80px; font-weight: 400">
More settings will appear here with time, hopefully replacing
......
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
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