Patrick Sun
5 лет назад
5 измененных файлов: 32 добавлений и 77 удалений
+ 10
- 1
src/app/app.component.html
Просмотреть файл
| <kendo-appbar *ngIf='login' [position]="'top'" [positionMode]="'sticky'"> | |||||
| <kendo-appbar *ngIf='login' class='appbar' [position]="'top'" [positionMode]="'sticky'"> | |||||
| <kendo-appbar-section> | <kendo-appbar-section> | ||||
| <kendo-menu [items]="items" (select)="onSelect($event)"> | <kendo-menu [items]="items" (select)="onSelect($event)"> | ||||
| <ng-template kendoMenuItemTemplate let-item="item"> | <ng-template kendoMenuItemTemplate let-item="item"> | ||||
| <app-loan-edit #loanEditComponent></app-loan-edit> | <app-loan-edit #loanEditComponent></app-loan-edit> | ||||
| <router-outlet></router-outlet> | <router-outlet></router-outlet> | ||||
| <div class="vimeo-wrapper"> | |||||
| <iframe id=bgVideo src="https://player.vimeo.com/video/468031372?background=1&controls=0" frameborder="0" | |||||
| allow="autoplay; fullscreen" allowfullscreen></iframe> | |||||
| <div class="overlay"> | |||||
| </div> | |||||
| </div> |
+ 20
- 27
src/app/app.component.scss
Просмотреть файл
| .target { | |||||
| border-radius: 5px; | |||||
| height: 100px; | |||||
| width: 400px; | |||||
| background-color: yellowgreen; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.26), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.08); | |||||
| } | |||||
| .placeholder { | |||||
| font-size: 20px; | |||||
| color: #656565; | |||||
| margin: 0; | |||||
| } | |||||
| .topMenuBar { | |||||
| left: 0px; | |||||
| top: 0px; | |||||
| // position: absolute; | |||||
| margin : 0px; | |||||
| width : 100%; | |||||
| display: block; | |||||
| background-color: rgb(229, 230, 218); | |||||
| box-shadow : 0px 0px 2px 0px #d6d2d2 | |||||
| } | |||||
| .vimeo-wrapper { | |||||
| position: fixed; | |||||
| top: 0; | |||||
| left: 0; | |||||
| width: 100%; | |||||
| height: 100%; | |||||
| z-index: -1; | |||||
| pointer-events: none; | |||||
| overflow: hidden; | |||||
| } | |||||
| .vimeo-wrapper iframe { | |||||
| width: 100vw; | |||||
| height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */ | |||||
| min-height: 100vh; | |||||
| min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */ | |||||
| position: absolute; | |||||
| top: 50%; | |||||
| left: 50%; | |||||
| transform: translate(-50%, -50%); | |||||
| } | |||||
| .appbar, | .appbar, | ||||
| .k-appbar-sticky{ | .k-appbar-sticky{ |
+ 1
- 1
src/app/auth/auth.component.scss
Просмотреть файл
| display: table; | display: table; | ||||
| width: 100%; | width: 100%; | ||||
| height: 100vh; | height: 100vh; | ||||
| opacity: 0.95; | |||||
| background: url('../../assets/img/body_bg.jpg') no-repeat center center fixed; | background: url('../../assets/img/body_bg.jpg') no-repeat center center fixed; | ||||
| } | } | ||||
| padding-bottom: 20px; | padding-bottom: 20px; | ||||
| box-shadow: 0 0 6px black; | box-shadow: 0 0 6px black; | ||||
| border-radius: 5px; | border-radius: 5px; | ||||
| opacity: 0.8; | |||||
| } | } |
+ 1
- 1
src/app/auth/dist/auth.component.css
Просмотреть файл
| display: table; | display: table; | ||||
| width: 100%; | width: 100%; | ||||
| height: 100vh; | height: 100vh; | ||||
| opacity: 0.95; | |||||
| background: url("../../assets/img/body_bg.jpg") no-repeat center center fixed; | background: url("../../assets/img/body_bg.jpg") no-repeat center center fixed; | ||||
| } | } | ||||
| padding-bottom: 20px; | padding-bottom: 20px; | ||||
| box-shadow: 0 0 6px black; | box-shadow: 0 0 6px black; | ||||
| border-radius: 5px; | border-radius: 5px; | ||||
| opacity: 0.8; | |||||
| } | } |
+ 0
- 47
src/index.html
Просмотреть файл
| <body> | <body> | ||||
| <app-root></app-root> | <app-root></app-root> | ||||
| <style> | |||||
| #bgVideo { | |||||
| position: fixed; | |||||
| right: 0; | |||||
| bottom: 0; | |||||
| min-width: 100%; | |||||
| min-height: 100%; | |||||
| z-index: -1; | |||||
| } | |||||
| html { | |||||
| background: url('./assets/img/body_bg.jpg') no-repeat center center fixed; | |||||
| -webkit-background-size: cover; | |||||
| -moz-background-size: cover; | |||||
| -o-background-size: cover; | |||||
| background-size: cover; | |||||
| } | |||||
| body { | |||||
| margin: 0; | |||||
| background-size: cover; | |||||
| } | |||||
| .vimeo-container { | |||||
| padding: 0; | |||||
| width: 100%; | |||||
| height: 100vh; | |||||
| overflow: hidden; | |||||
| position: relative; | |||||
| } | |||||
| iframe { | |||||
| box-sizing: border-box; | |||||
| width: 177.77777778vh; | |||||
| height: 56.25vw; | |||||
| min-width: 100%; | |||||
| min-height: 100%; | |||||
| position: absolute; | |||||
| top: 50%; | |||||
| left: 50%; | |||||
| transform: translate(-50%, -50%); | |||||
| } | |||||
| </style> | |||||
| <!-- <iframe id=bgVideo src="https://player.vimeo.com/video/468031372?background=1&controls=0" frameborder="0" | |||||
| allow="autoplay; fullscreen" allowfullscreen></iframe> --> | |||||
| </body> | </body> | ||||
| </html> | </html> |
Загрузка…