From 28bf77af84fef634ad749d5018bb0415ef112d18 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Mon, 7 Nov 2016 19:12:26 +0100 Subject: [PATCH] Home styling and small bugfixes --- .../Identity/LazyClientStore.cs | 2 +- .../Identity/MyIdentityOptions.cs | 8 ++++--- src/Squidex/app/app.component.ts | 2 +- .../internal/apps/apps-page.component.html | 2 +- .../layout/apps-menu.component.html | 4 ++-- .../layout/apps-menu.component.scss | 1 + .../layout/profile-menu.component.html | 2 +- .../layout/profile-menu.component.scss | 1 + .../layout/profile-menu.component.ts | 15 ++++++++---- .../public/home-page.component.html | 13 +++++++++- .../public/home-page.component.scss | 24 +++++++++++++++++++ .../components/public/home-page.component.ts | 3 ++- .../framework/angular/modal-view.directive.ts | 4 ++++ .../app/shared/services/auth.service.ts | 4 ++-- src/Squidex/app/theme/_mixins.scss | 9 +++++++ src/Squidex/app/vendor.ts | 8 ++++--- 16 files changed, 82 insertions(+), 20 deletions(-) create mode 100644 src/Squidex/app/components/public/home-page.component.scss diff --git a/src/Squidex/Configurations/Identity/LazyClientStore.cs b/src/Squidex/Configurations/Identity/LazyClientStore.cs index 8f0f8a740..bf63b5843 100644 --- a/src/Squidex/Configurations/Identity/LazyClientStore.cs +++ b/src/Squidex/Configurations/Identity/LazyClientStore.cs @@ -53,7 +53,7 @@ namespace Squidex.Configurations.Identity }, PostLogoutRedirectUris = new List { - options.BuildUrl("logout") + options.BuildUrl("logout", false) }, AllowAccessTokensViaBrowser = true, AllowedGrantTypes = GrantTypes.Implicit, diff --git a/src/Squidex/Configurations/Identity/MyIdentityOptions.cs b/src/Squidex/Configurations/Identity/MyIdentityOptions.cs index 388545327..b208ba835 100644 --- a/src/Squidex/Configurations/Identity/MyIdentityOptions.cs +++ b/src/Squidex/Configurations/Identity/MyIdentityOptions.cs @@ -24,12 +24,14 @@ namespace Squidex.Configurations.Identity public bool RequiresHttps { get; set; } - public string BuildUrl(string path) + public string BuildUrl(string path, bool trailingSlash = true) { var url = $"{BaseUrl.TrimEnd('/')}/{path.Trim('/')}"; - if (url.IndexOf("?", StringComparison.OrdinalIgnoreCase) < 0 && - url.IndexOf(";", StringComparison.OrdinalIgnoreCase) < 0) { + if (trailingSlash && + url.IndexOf("?", StringComparison.OrdinalIgnoreCase) < 0 && + url.IndexOf(";", StringComparison.OrdinalIgnoreCase) < 0) + { url = url + "/"; } diff --git a/src/Squidex/app/app.component.ts b/src/Squidex/app/app.component.ts index 41e92bfa4..981364036 100644 --- a/src/Squidex/app/app.component.ts +++ b/src/Squidex/app/app.component.ts @@ -11,6 +11,6 @@ import * as Ng2 from '@angular/core'; selector: 'sqx-app', template }) -export class AppComponent { +export class AppComponent { public isLoaded = false; } \ No newline at end of file diff --git a/src/Squidex/app/components/internal/apps/apps-page.component.html b/src/Squidex/app/components/internal/apps/apps-page.component.html index 60cd45af8..7838bbda2 100644 --- a/src/Squidex/app/components/internal/apps/apps-page.component.html +++ b/src/Squidex/app/components/internal/apps/apps-page.component.html @@ -6,7 +6,7 @@ -
+
diff --git a/src/Squidex/app/components/layout/apps-menu.component.html b/src/Squidex/app/components/layout/apps-menu.component.html index cf4c2846c..f16c62415 100644 --- a/src/Squidex/app/components/layout/apps-menu.component.html +++ b/src/Squidex/app/components/layout/apps-menu.component.html @@ -2,7 +2,7 @@
  • {{app | async}} -
    +
    @@ -12,7 +12,7 @@
    • -
    +
    diff --git a/src/Squidex/app/components/layout/apps-menu.component.scss b/src/Squidex/app/components/layout/apps-menu.component.scss index 952fc8366..a6a9994c9 100644 --- a/src/Squidex/app/components/layout/apps-menu.component.scss +++ b/src/Squidex/app/components/layout/apps-menu.component.scss @@ -37,6 +37,7 @@ & { @include transition(opacity .4 ease); @include opacity(.95); + @include no-selection; padding-right: 15px; cursor: pointer; color: $accent-dark; diff --git a/src/Squidex/app/components/layout/profile-menu.component.html b/src/Squidex/app/components/layout/profile-menu.component.html index 7fd598354..7da4115ef 100644 --- a/src/Squidex/app/components/layout/profile-menu.component.html +++ b/src/Squidex/app/components/layout/profile-menu.component.html @@ -6,7 +6,7 @@ {{displayName | async}} -
    +
    Logout
    diff --git a/src/Squidex/app/components/layout/profile-menu.component.scss b/src/Squidex/app/components/layout/profile-menu.component.scss index 47eedc10e..8ba0ee672 100644 --- a/src/Squidex/app/components/layout/profile-menu.component.scss +++ b/src/Squidex/app/components/layout/profile-menu.component.scss @@ -15,6 +15,7 @@ img { .navbar-nav { .nav-link { + @include no-selection; padding: 0; cursor: pointer; color: $accent-dark; diff --git a/src/Squidex/app/components/layout/profile-menu.component.ts b/src/Squidex/app/components/layout/profile-menu.component.ts index 8f4abd004..950115ad5 100644 --- a/src/Squidex/app/components/layout/profile-menu.component.ts +++ b/src/Squidex/app/components/layout/profile-menu.component.ts @@ -7,20 +7,27 @@ import * as Ng2 from '@angular/core'; -import { AuthService, ModalView } from 'shared'; +import { + AuthService, + fadeAnimation, + ModalView +} from 'shared'; @Ng2.Component({ selector: 'sqx-profile-menu', styles, - template + template, + animations: [ + fadeAnimation() + ] }) export class ProfileMenuComponent { public modalMenu = new ModalView(); - public displayName + public displayName = this.auth.isAuthenticatedChanges.map(t => t ? this.auth.user.displayName : null); - public pictureUrl + public pictureUrl = this.auth.isAuthenticatedChanges.map(t => t ? this.auth.user.pictureUrl : null); constructor( diff --git a/src/Squidex/app/components/public/home-page.component.html b/src/Squidex/app/components/public/home-page.component.html index eae813554..2e769ac67 100644 --- a/src/Squidex/app/components/public/home-page.component.html +++ b/src/Squidex/app/components/public/home-page.component.html @@ -1,2 +1,13 @@ +
    + - \ No newline at end of file + + + + +

    + Proudly made by Quaisar Ahmad & Sebastian Stehle, 2016-2017 +

    +

    \ No newline at end of file diff --git a/src/Squidex/app/components/public/home-page.component.scss b/src/Squidex/app/components/public/home-page.component.scss new file mode 100644 index 000000000..f715d77b6 --- /dev/null +++ b/src/Squidex/app/components/public/home-page.component.scss @@ -0,0 +1,24 @@ +.content { + margin: 100px auto; + max-width: 500px; + text-align: center; +} + +.logo { + height: 60px; + display: display-block; +} + +.login-button { + margin: 40px 0; +} + +.login-hint { + font-style: italic; +} + +.proudly-made { + margin-top: 100px; + font-size: 11px; + font-style: italic; +} \ No newline at end of file diff --git a/src/Squidex/app/components/public/home-page.component.ts b/src/Squidex/app/components/public/home-page.component.ts index f1356ce50..f1de1ed4b 100644 --- a/src/Squidex/app/components/public/home-page.component.ts +++ b/src/Squidex/app/components/public/home-page.component.ts @@ -11,7 +11,8 @@ import * as Ng2Router from '@angular/router'; import { AuthService, TitleService } from 'shared'; @Ng2.Component({ - selector: 'not-found', + selector: 'home-page', + styles, template }) export class HomePageComponent implements Ng2.OnInit { diff --git a/src/Squidex/app/framework/angular/modal-view.directive.ts b/src/Squidex/app/framework/angular/modal-view.directive.ts index 0438ee483..2b7b009b6 100644 --- a/src/Squidex/app/framework/angular/modal-view.directive.ts +++ b/src/Squidex/app/framework/angular/modal-view.directive.ts @@ -63,6 +63,10 @@ export class ModalViewDirective implements Ng2.OnChanges, Ng2.OnInit, Ng2.OnDest if (this.modalView) { this.subscription = this.modalView.isOpen.subscribe(isOpen => { if (this.isEnabled) { + if (isOpen === (this.view !== null)) { + return; + } + if (isOpen) { this.view = this.viewContainer.createEmbeddedView(this.templateRef); diff --git a/src/Squidex/app/shared/services/auth.service.ts b/src/Squidex/app/shared/services/auth.service.ts index f4c09e0e0..a9d11c6db 100644 --- a/src/Squidex/app/shared/services/auth.service.ts +++ b/src/Squidex/app/shared/services/auth.service.ts @@ -63,8 +63,8 @@ export class AuthService { client_id: 'squidex-frontend', scope: 'squidex-api openid profile squidex-profile', response_type: 'id_token token', - redirect_uri: apiUrl.buildUrl('/login;'), - post_logout_redirect_uri: apiUrl.buildUrl('/logout;'), + redirect_uri: apiUrl.buildUrl('login;'), + post_logout_redirect_uri: apiUrl.buildUrl('logout'), silent_redirect_uri: apiUrl.buildUrl('identity-server/client-callback-silent/'), popup_redirect_uri: apiUrl.buildUrl('identity-server/client-callback-popup/'), authority: apiUrl.buildUrl('identity-server/'), diff --git a/src/Squidex/app/theme/_mixins.scss b/src/Squidex/app/theme/_mixins.scss index 78f0a4297..979dba617 100644 --- a/src/Squidex/app/theme/_mixins.scss +++ b/src/Squidex/app/theme/_mixins.scss @@ -43,6 +43,15 @@ box-shadow: inset 1px 1px 1px $color; } +@mixin no-selection() { + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + @mixin ellipsis() { -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis; diff --git a/src/Squidex/app/vendor.ts b/src/Squidex/app/vendor.ts index 41b7a3bb8..67059b1df 100644 --- a/src/Squidex/app/vendor.ts +++ b/src/Squidex/app/vendor.ts @@ -14,11 +14,13 @@ import '@angular/http'; import '@angular/forms'; import '@angular/router'; -// Oidc-client +// Additional libs +import 'rxjs'; + import 'oidc-client'; -// RxJS -import 'rxjs'; +import 'moment'; +import 'immutable'; // Bootstrap import 'theme/vendor.scss'; \ No newline at end of file