Skip to content
This repository has been archived by the owner on Dec 22, 2022. It is now read-only.

Commit

Permalink
Merge pull request #134 from NuvandaPV/master
Browse files Browse the repository at this point in the history 
Fix #127
  • Loading branch information
@jp-hoehmann
jp-hoehmann authored Oct 22, 2017
2 parents 2505e80 + 92ae729 commit 65a1dcf
Show file tree
Hide file tree
Showing 13 changed files with 200 additions and 105 deletions.
2 changes: 1 addition & 1 deletion src/app/_insight-dialog.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<!-- HTML template for the InsightDialogComponent -->
<h2 mat-dialog-title>
<span *ngIf='page'>{{page.name}}:</span>
<span *ngIf='page' class='desktop-only'>{{page.name}}:</span>
Statistiken
</h2>
<mat-dialog-content *ngIf='!loaded'>
Expand Down
154 changes: 95 additions & 59 deletions src/app/_layout.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,66 +70,102 @@
</button>
<span class='app-toolbar-title'>{{title.getTitle()}}</span>
<span class='app-toolbar-filler'></span>
<button
*ngIf='params.profile'
mat-button
class='app-icon-button'
matTooltip="Neu laden"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
(click)='appRoutingService.refresh([appService.PROFILE])'>
<mat-icon>refresh</mat-icon>
</button>
<button
*ngIf='page && page.insights'
mat-button
class='app-icon-button'
matTooltip="Statistiken"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
(click)='openInsightDialog()'>
<mat-icon>poll</mat-icon>
</button>
<button
*ngIf='params.profile'
mat-button
class='app-icon-button'
matTooltip="Dashboard"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
[appLink]='{master: null}'>
<mat-icon>dashboard</mat-icon>
</button>
<a
mat-button
class='button app-icon-button'
matTooltip="Facebook"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
href='//facebook.com/{{params.profile}}'
target='_blank'>
<mat-icon>open_in_browser</mat-icon>
</a>
<button
mat-button
class='app-icon-button'
matTooltip="Einstellungen"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
(click)='openSettingsDialog()'>
<mat-icon>settings</mat-icon>
</button>
<!--
<mat-menu #settings='matMenu'>
<div mat-menu-item>
<mat-slide-toggle
[(ngModel)]='settingsService.settings.ui.dark'>
Dark mode
<mat-icon>invert_colors</mat-icon>
</mat-slide-toggle>
</div>
<span class='desktop-only'>
<button
*ngIf='params.profile'
mat-button
class='app-icon-button'
matTooltip="Neu laden"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
(click)='refresh()'>
<mat-icon>refresh</mat-icon>
</button>
<button
*ngIf='page && page.insights'
mat-button
class='app-icon-button'
matTooltip="Statistiken"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
(click)='openInsightDialog()'>
<mat-icon>poll</mat-icon>
</button>
<button
*ngIf='params.profile'
mat-button
class='app-icon-button'
matTooltip="Dashboard"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
[appLink]='{master: null}'>
<mat-icon>dashboard</mat-icon>
</button>
<a
mat-button
class='button app-icon-button'
matTooltip="Facebook"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
href='//facebook.com/{{params.profile}}'
target='_blank'>
<mat-icon>open_in_browser</mat-icon>
</a>
<button
mat-button
class='app-icon-button'
matTooltip="Einstellungen"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
(click)='openSettingsDialog()'>
<mat-icon>settings</mat-icon>
</button>
</span>
<span class='mobile-only'>
<button
mat-button
class='app-icon-button'
matTooltip="Menü"
matTooltipShowDelay='1500'
matTooltipHideDelay='1500'
[matMenuTriggerFor]='menu'>
<mat-icon>more_vert</mat-icon>
</button>
</span>
<mat-menu #menu='matMenu'>
<button
*ngIf='params.profile'
mat-menu-item
(click)='refresh()'>
<mat-icon>refresh</mat-icon>
Neu laden
</button>
<button
*ngIf='page && page.insights'
mat-menu-item
(click)='openInsightDialog()'>
<mat-icon>poll</mat-icon>
Statistiken
</button>
<button
*ngIf='params.profile'
mat-menu-item
[appLink]='{master: null}'>
<mat-icon>dashboard</mat-icon>
Dashboard
</button>
<a
mat-menu-item
href='//facebook.com/{{params.profile}}'
target='_blank'>
<mat-icon>open_in_browser</mat-icon>
Facebook
</a>
<button mat-menu-item (click)='openSettingsDialog()'>
<mat-icon>settings</mat-icon>
Einstellungen
</button>
</mat-menu>
-->
</mat-toolbar>
<div id='displacer-target'></div>
<ng-content select='main'></ng-content>
Expand Down
64 changes: 41 additions & 23 deletions src/app/_styles.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,8 +40,6 @@ body {
}

button, .button {
@extend .truncate;

margin: 6px 8px!important;
padding: 0 8px!important;
}
Expand All @@ -66,87 +64,88 @@ insight {
}
}

mat-card {
mat-card.mat-card {
padding: 24px!important;

.mat-card-image {
margin: 0 -24px 16px -24px!important;
width: calc(100% + 48px)!important;

img {
width: 100%;
}
}

.mat-card-image:first-child {
margin-top: -24px!important;
}
}

mat-card-content p {
mat-card-content.mat-card-content p {
text-overflow: clip;
}

mat-card-footer {
mat-card-footer.mat-card-footer {
display: flex!important;
justify-content: flex-end;
}

mat-card-footer > * {
mat-card-footer.mat-card-footer > * {
margin-top: 0 !important;
margin-bottom: 0 !important;
}

mat-dialog-actions, .app-snackbar-actions {
mat-dialog-actions.mat-dialog-actions, .app-snackbar-actions {
padding: 12px 0;
display: flex;
flex-direction: row-reverse;
flex-wrap: wrap;
flex-wrap: wrap-reverse;
}

mat-dialog-container {
mat-dialog-container.mat-dialog-container {
margin: auto;
max-width: calc(100vw - 32px);
}

mat-dialog-container > * {
mat-dialog-container.mat-dialog-container > * {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}

mat-dialog-container > * > * {
mat-dialog-container.mat-dialog-container > * > * {
flex-shrink: 0;
}

mat-dialog-container > * > mat-dialog-content {
mat-dialog-container.mat-dialog-container > * > mat-dialog-content {
flex-grow: 1;
flex-shrink: 1;
max-height: none;
margin-top: -16px!important;
margin-bottom: -16px!important;
padding-top: 16px!important;
padding-bottom: 16px!important;
}

mat-icon {
mat-icon.mat-icon {
vertical-align: middle;
}

mat-input-container {
mat-input-container.mat-input-container {
width: 100%!important;
}

mat-sidenav-container > * {
mat-sidenav-container.mat-sidenav-container > * {
display: flex!important;
flex-direction: column;
height: 100vh!important;
}

mat-sidenav-container .mat-sidenav-content {
mat-sidenav-container.mat-sidenav-container .mat-sidenav-content {
overflow: hidden;
}

nav, aside, main {
overflow-x: hidden;
overflow-y: scroll;
}

mat-spinner {
margin: auto;
}
Expand All @@ -162,6 +161,10 @@ mat-grid-tile:hover {
a { color: $primary-light-fg; }
}

mat-tab-body, .mat-tab-body-content {
overflow: hidden!important;
}

mat-tab-header {
.mat-tab-label-container {
justify-content: center;
Expand All @@ -177,6 +180,11 @@ mat-toolbar {
button, .button { color: white!important; }
}

nav, aside, main {
overflow-x: hidden;
overflow-y: scroll;
}

profile .mat-card-header-text > mat-card-title {
@extend .truncate;
}
Expand Down Expand Up @@ -251,6 +259,7 @@ mat-card-footer > *,
padding: 0;
text-align: left;
text-decoration: none;
display: inline!important;
}

.app-toolbar-filler {
Expand All @@ -261,6 +270,10 @@ mat-card-footer > *,
clear: both;
}

.cdk-overlay-pane {
max-height: calc(100vh - 48px);
}

.flex {
display: flex;
}
Expand Down Expand Up @@ -309,6 +322,11 @@ mat-card-footer > *,
opacity: 0;
}

.mat-menu-content > button {
margin: 0!important;
padding: 0 16px!important;
}

.pad {
margin: 24px;
}
Expand Down Expand Up @@ -431,14 +449,14 @@ mat-card-footer > *,
}

/*
* Everything excapt smaller portrait mode devices.
* Everything except smaller portrait mode devices.
*/
@media (min-width: 480px) {
h1 > small {
float: right;
}

.mobile-only, h1 br {
.mobile-only {
display: none;
}
}
Expand Down
5 changes: 2 additions & 3 deletions src/app/aside/_comment.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,10 @@
<profile-card [profile]='_comment.from'>
<div *ngIf='_comment.attachment' mat-card-image>
<a *ngIf='!video' [href]='_comment.attachment.url' target='_blank'>
<img mat-card-image [src]='_comment.attachment.media.image.src'>
<img [src]='_comment.attachment.media.image.src'>
</a>
<video
*ngIf='video'
mat-card-image
controls
preload='metadata'
[poster]='_comment.attachment.media.image.src'>
Expand Down Expand Up @@ -54,7 +53,7 @@
<button
mat-button
color='primary'
[disabled]='(params | async).profile === _comment.from.id'
[disabled]='showProfileButtonDisabledStatus'
[appLink]='utilService.profileLink(_comment.from.id)'>
Profil zeigen
<mat-icon>account_box</mat-icon>
Expand Down
Loading

0 comments on commit 65a1dcf

Please sign in to comment.