Some styling changes to the discover page

pull/4132/head
twanariens 4 years ago
parent 1c8ab3cee2
commit 94862aee37

@ -3,7 +3,7 @@
<div id="result{{result.id}}" *ngIf="fullyLoaded" class="ombi-card dark-card c" [style.display]="hide ? 'none' : 'block'">
<div class="card-top-info">
<div class="top-left" id="type{{result.id}}">
{{RequestType[result.type] | humanize}}
{{ 'Common.' + RequestType[result.type] | translate }}
</div>
<div class="{{getStatusClass()}} top-right" id="status{{result.id}}">
<span class="indicator"></span><span class="indicator-text" id="availabilityStatus{{result.id}}">{{getAvailbilityStatus()}}</span>
@ -21,9 +21,10 @@
</div>
<div class="row button-request-container" *ngIf="!result.available && !result.approved && !result.requested">
<div class="button-request poster-overlay">
<button id="requestButton{{result.id}}{{result.type}}{{discoverType}}" mat-raised-button class="btn-green full-width poster-request-btn" (click)="request($event)">
<button id="requestButton{{result.id}}{{result.type}}{{discoverType}}" mat-raised-button class="btn-ombi full-width poster-request-btn" (click)="request($event)">
<i *ngIf="!loading" class="fa-lg fas fa-cloud-download-alt"></i>
<i *ngIf="loading" class="fas fa-spinner fa-pulse fa-2x fa-fw" aria-hidden="true"></i>
{{'Common.Request' | translate }}
</button>
</div>
</div>

@ -1,5 +1,4 @@
$ombi-primary:#3f3f3f;
$card-background: #2b2b2b;
@import "~styles/variables.scss";
#cardImage {
border-radius: 5px;
@ -141,19 +140,20 @@ small {
.card-top-info{
position: absolute;
text-transform: uppercase;
top: 0px;
width: 100%;
background-color: rgba(15,23,31,0.6);
background-color: rgba(15,23,31,0.7);
display:flex;
justify-content: space-between;
padding-top:0.6em;
padding-bottom:0.3em;
z-index:2;
letter-spacing: 0.2px;
}
.top-left {
font-size: 14px;
font-weight:200;
padding-left: 0.5em;
font-size: 14px;
}
@ -161,6 +161,7 @@ small {
/* common */
.top-right{
display:flex;
font-weight:200;
}
.top-right span.indicator, span.indicator-text {
@ -247,7 +248,7 @@ a.poster-overlay:hover{
width: 100%;
margin-left: 0;
margin-right: 0;
margin-top: -37px;
margin-top: -36px;
margin-bottom: 0px;
opacity:0;
transition: .5s ease;
@ -261,4 +262,8 @@ a.poster-overlay:hover{
.c:hover .button-request-container {
opacity:1;
}
.btn-ombi{
background-color:$ombi-active-text;
}

@ -92,7 +92,7 @@
font-size: 0.8em;
font-weight: 100;
display:flex;
justify-content: end;
justify-content: flex-end;
align-items: flex-end;
text-transform: capitalize;
flex:0 0 250px;
@ -139,7 +139,6 @@
text-transform: uppercase;
color: $ombi-active;
align-items:center;
justify-content: center;
font-weight: 700;
font-size:36px;
padding:40px 20px;
@ -147,7 +146,6 @@
max-width: 350px;
display: flex;
white-space: normal;
text-align: center;
}
.outer-profile {

@ -31,7 +31,9 @@
"Validation": "Please check your entered values"
},
"Cancel": "Cancel",
"Submit": "Submit"
"Submit": "Submit",
"tvShow": "TV Show",
"movie": "Movie"
},
"PasswordReset": {
"EmailAddressPlaceholder": "Email Address",

Loading…
Cancel
Save