1
0
mirror of https://github.com/dkmstr/openuds-gui.git synced 2024-10-26 08:55:23 +03:00

fixed plugins download

This commit is contained in:
Adolfo Gómez García 2018-09-06 11:12:06 +02:00
parent ea5b3780ad
commit ebda053271
6 changed files with 91 additions and 27 deletions

View File

@ -23,7 +23,6 @@
<button mat-menu-item routerLink="/about"><i class="fa fa-info"></i><uds-translate>About</uds-translate></button>
</mat-menu>
<mat-toolbar color="primary" class="uds-nav">
<button mat-button routerLink="/">

View File

@ -1,10 +1,49 @@
.card {
min-width: 12rem;
max-width: 12rem;
.banner {
display: flex;
justify-content: center;
margin-bottom: 2rem;
}
.card-img-top {
padding-left: 2rem;
padding-right: 2rem;
margin-top: 1rem;
}
.banner-text h1 {
font-size: 3rem;
text-align: center;
}
.banner-text h2 {
font-size: 1rem;
}
.plugins {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin: 0 10%;
}
.plugin {
/*width: 16rem;*/
margin: 0 1rem 2rem 0;
padding: 1rem;
box-shadow: 0 1rem 2rem rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
transition: all 0.3s cubic-bezier(.25,.8,.25,1);
flex: 1 0 21%;
}
.plugin:hover {
box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}
.image {
display: flex;
justify-content: center;
}
.platform {
text-align: center;
font-size: 2rem;
}
.description {
display: flex;
text-align: justify;
}

View File

@ -1,23 +1,24 @@
<div class="px-3 py-3 pt-md-5 pb-md-4 mx-auto text-center">
<h1 class="display-4">
<uds-translate>UDS Plugin</uds-translate>
</h1>
<p class="lead">
<uds-translate>Download UDS client plugin for your platform</uds-translate>
</p>
<div class="banner">
<div class="banner-text">
<h1>
<uds-translate>UDS Plugin</uds-translate>
</h1>
<h2>
<uds-translate>Download UDS client plugin for your platform</uds-translate>
</h2>
</div>
</div>
<div class="container">
<div class="card-deck mb-3">
<div class="card mb-4" *ngFor="let p of api.plugins">
<img class="card-img-top" src="/static/modern/img/{{ p.name }}.png">
<div class="card-body d-flex flex-column">
<h4 class="card-title">{{ p.name }}</h4>
<p class="card-text">{{ p.description }}</p>
<a class="btn btn-lg btn-block btn-outline-primary mt-auto" href="{{ p.url }}">
<uds-translate>Download</uds-translate>
</a>
</div>
<div class="plugins">
<div class="plugin" *ngFor="let p of api.plugins" (click)="download(p.url)">
<div class="image">
<img src="/static/modern/img/{{ p.name }}.png">
</div>
<div class="platform">
{{ p.name }}
</div>
<div class="description">
{{ p.description }}
</div>
</div>
</div>

View File

@ -17,4 +17,7 @@ export class ClientDownloadComponent implements OnInit {
ngOnInit() {
}
download(url) {
window.location.href = url;
}
}

View File

@ -1,3 +1,18 @@
.plugin {
width: 12rem;
margin-right: 1rem;
padding: 0.1rem;
box-shadow: 0 1rem 2rem rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}
.plugin:hover {
box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}
.group-title {
height: 4rem;
display: flex;

View File

@ -11,3 +11,10 @@ body {
margin: 4rem 0 0 0; /* leaves space for toolbar on top */
font-family: 'Roboto', sans-serif;
}
.content {
width: 100%;
margin-right: auto;
margin-left: auto;
background-color: aqua;
}