diff --git a/src/Ombi/ClientApp/src/app/calendar/components/calendar.component.scss b/src/Ombi/ClientApp/src/app/calendar/components/calendar.component.scss
index 195b7ff32..21fc73470 100644
--- a/src/Ombi/ClientApp/src/app/calendar/components/calendar.component.scss
+++ b/src/Ombi/ClientApp/src/app/calendar/components/calendar.component.scss
@@ -1,5 +1,87 @@
+@import "~styles/variables.scss";
.small-middle-container{
margin: auto;
- width: 80%;
+ width: 85%;
}
+
+//Kinda restyled the entire calendar
+::ng-deep .dark .fc th {
+ background-color:#545454 !important;
+ color: #FFF;
+ border: 1px solid #303030;
+}
+
+::ng-deep .dark .fc td.ui-widget-content{
+ background-color:#424242 !important;
+ color: #FFF;
+ border: 1px solid #303030;
+}
+
+::ng-deep .dark .fc td.fc-head-container {
+ border: 1px solid #303030;
+}
+
+::ng-deep .dark fc-day-grid-event fc-h-event fc-event fc-start fc-end{
+ background:$accent-dark !important;
+}
+
+::ng-deep .ui-button {
+ margin-top:10px !important;
+ text-transform: uppercase;
+ text-decoration: none;
+ padding: 8px;
+ border: 1px solid rgb(221, 221, 221) !important;
+ display: inline-block;
+ transition: all 0.4s ease 0s;
+ background-color: $accent !important;
+ }
+
+::ng-deep .dark .ui-button {
+ background-color: $accent-dark !important;
+ border: 1px solid #494949 !important;
+ color: #494949 !important;
+}
+
+::ng-deep .dark .ui-button:enabled:hover {
+ color: #303030 !important;
+ background: $accent-dark !important;
+ border-color: $accent-dark !important;
+ transition: all 0.4s ease 0s;
+ }
+
+::ng-deep .input-group-addon{
+ margin-left:10px;
+}
+
+::ng-deep .fc .fc-event{
+ background: $accent !important;
+ color:#FFF !important;
+ font-size:0.9em;
+ font-weight:400;
+ border: 0px solid !important;
+}
+
+::ng-deep .dark .fc .fc-event{
+ background:$accent-dark !important;
+ color:#303030 !important;
+ font-size:0.9em;
+ font-weight:400;
+}
+
+::ng-deep .fc-header-toolbar{
+ display:block;
+}
+
+::ng-deep .fc-left{
+ float:left;
+}
+
+::ng-deep .fc-right{
+ float:right;
+}
+
+::ng-deep .fc-center{
+ margin-left:44%;
+ padding-top: 10px;
+}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/calendar/components/calendar.component.ts b/src/Ombi/ClientApp/src/app/calendar/components/calendar.component.ts
index 0a183651a..64f5c7db1 100644
--- a/src/Ombi/ClientApp/src/app/calendar/components/calendar.component.ts
+++ b/src/Ombi/ClientApp/src/app/calendar/components/calendar.component.ts
@@ -17,7 +17,6 @@ export class CalendarComponent implements OnInit {
constructor(private calendarService: CalendarService) { }
public async ngOnInit() {
- debugger;
this.loading()
this.entries = await this.calendarService.getCalendarEntries();
@@ -26,10 +25,9 @@ export class CalendarComponent implements OnInit {
header: {
left: 'prev,next',
center: 'title',
- right: 'month,agendaWeek'
+ right: 'agendaWeek,month'
},
eventClick: (e: any) => {
- debugger;
e.preventDefault();
}
};
diff --git a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card-details.component.scss b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card-details.component.scss
index 2e6ec8c7d..8d2e06a92 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card-details.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card-details.component.scss
@@ -16,6 +16,7 @@
.details strong {
font-weight: bold;
}
+
.grow {
transition: all .2s ease-in-out;
}
@@ -47,4 +48,4 @@ h3 strong {
.overview {
height:300px;
overflow-y: scroll;
-}
\ No newline at end of file
+}
diff --git a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
index 3bd9d301f..f55b989f2 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
@@ -2,14 +2,17 @@ $ombi-primary:#3f3f3f;
$card-background: #2b2b2b;
#cardImage {
border-radius: 5px 5px 0px 0px;
+ height:75%;
}
.dark-card {
border-radius: 8px;
}
+// Changed height to 100% to make all cards the same height
.card-spacing {
margin-top: 10%;
+ height:100%;
}
@@ -39,8 +42,10 @@ $border-width: 3px;
text-align: center;
}
+// Changed height to 100% to make all cards the same height
.grow {
transition: all .2s ease-in-out;
+ height:100%;
}
.grow:hover {
@@ -52,3 +57,25 @@ $border-width: 3px;
// color: white;
border-radius: 2%
}
+
+
+/* Title adjust for the Discover page */
+.mat-card-content h6 {
+ overflow:hidden;
+ white-space:nowrap;
+ font-weight:400;
+ font-size:1.1rem;
+}
+
+/* Summary adjust for Discover page */
+.small, small {
+ font-size:0.8rem;
+}
+
+@media (min-width: 2000px) {
+ #cardImage {
+ height:80%;
+ object-fit:cover;
+ display:block;
+ }
+}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
index 1e50c5e1f..1fffc3bbc 100644
--- a/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
+++ b/src/Ombi/ClientApp/src/app/discover/components/discover/discover.component.scss
@@ -4,7 +4,7 @@
.small-middle-container {
margin: auto;
- width: 80%;
+ width: 85%;
}
.small-padding {
@@ -24,4 +24,153 @@
.small-space {
padding-top: 1%;
+}
+
+::ng-deep .mat-card-image {
+ height:75%;
+ object-fit:cover;
+ display:block;
+}
+
+.card-spacing {
+ height:100%;
+}
+
+.mat-card-content h6 {
+ overflow:hidden;
+ white-space:nowrap;
+ font-weight:500;
+ font-size:1.1rem;
+}
+
+@media (min-width: 300px) {
+ .col-xl-2 {
+ flex: 0 0 100%;
+ max-width: 100%;
+ min-width: 100%;
+ }
+ .small-middle-container{
+ width:100%;
+ }
+
+ .btn-group {
+ width:100%;
+ }
+
+ mat-button-base {
+ width:100%;
+ }
+
+ .col{
+ padding-right: 10px !important;
+ padding-left:10px !important;
+ }
+
+ .row{
+ margin-left:0px;
+ }
+
+ .small-padding{
+ padding-left: 5px !important;
+ padding-right: 0px !important;
+ height: 40em;
+ }
+
+ ::ng-deep .mat-card-image {
+ height:85% !important;
+ }
+}
+
+@media (min-width: 600px) {
+ .justify-content-md-center {
+ justify-content: center !important;
+ }
+ .small-middle-container{
+ width:auto;
+ }
+
+ .btn-group {
+ width:auto;
+ }
+
+ mat-button-base {
+ width:auto;
+ }
+
+ ::ng-deep .mat-card-image {
+ height:75% !important;
+ }
+}
+
+@media (min-width: 700px) {
+ .col-xl-2 {
+ flex: 0 0 50%;
+ max-width: 50%;
+ min-width: 50%;
+ }
+
+ .col{
+ padding-right: 15px !important;
+ padding-left: 15px !important;
+ }
+
+ .small-padding{
+ padding-left: 20px !important;
+ padding-right: 20px !important;
+ height:auto;
+ }
+
+ .row{
+ margin-left:0px;
+ }
+
+ .small-middle-container{
+ width:auto;
+ }
+
+ .btn-group {
+ width:auto;
+ }
+
+ mat-button-base {
+ width:auto;
+ }
+}
+
+@media (min-width: 1000px) {
+ .col-xl-2 {
+ flex: 0 0 33.33333%;
+ max-width: 33.33333%;
+ min-width: 33.33333%;
+ }
+}
+
+@media (min-width: 1300px) {
+ .col-xl-2 {
+ flex: 0 0 20%;
+ max-width: 25%;
+ min-width: 25%;
+ }
+}
+
+@media (min-width: 1600px) {
+ .col-xl-2 {
+ flex: 0 0 20%;
+ max-width: 20%;
+ min-width: 20%;
+ }
+}
+@media (min-width: 1900px) {
+ .col-xl-2 {
+ flex: 0 0 16.66666667%;
+ max-width: 16.66666667%;
+ min-width: 16.66666667%;
+ }
+}
+@media (min-width: 2200px) {
+ .col-xl-2 {
+ flex: 0 0 14.285713%;
+ max-width: 14.285713%;
+ min-width: 14.285713%;
+ }
}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html b/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html
index e4bf0cfe8..81ae7d6f9 100644
--- a/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html
+++ b/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.html
@@ -9,10 +9,12 @@
{{nav.name | translate}}
-
-