Begin new menu design

This commit is contained in:
Chocobozzz 2017-12-01 09:20:19 +01:00
parent fef2c7164e
commit b33f657c30
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
26 changed files with 432 additions and 263 deletions

View File

@ -153,7 +153,7 @@ module.exports = function (options) {
]
},
{ test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000&minetype=application/font-woff' },
{ test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'file-loader' },
{ test: /\.(otf|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000' },
/* Raw loader support for *.html
* Returns file content as string

View File

@ -70,7 +70,7 @@
"markdown-it": "^8.4.0",
"ng-router-loader": "^2.0.0",
"ngc-webpack": "3.2.2",
"ngx-bootstrap": "1.9.3",
"ngx-bootstrap": "2.0.0-beta.9",
"ngx-chips": "1.5.3",
"node-sass": "^4.1.1",
"normalize.css": "^7.0.0",
@ -86,6 +86,7 @@
"sass-resources-loader": "^1.2.1",
"script-ext-html-webpack-plugin": "^1.3.2",
"source-map-loader": "^0.2.1",
"source-sans-pro": "^2.0.10",
"standard": "^10.0.0",
"string-replace-loader": "^1.0.3",
"style-loader": "^0.19.0",

View File

@ -1,7 +1,7 @@
<div class="container-fluid">
<div class="row header">
<div class="col-md-2 col-sm-3 col-xs-3 top-left-block" [ngClass]="{ 'border-bottom': isMenuDisplayed === false }">
<div class="top-left-block" [ngClass]="{ 'border-bottom': isMenuDisplayed === false }">
<div class="hamburger-block" (click)="toggleMenu()">
<span class="glyphicon glyphicon-menu-hamburger"></span>
</div>
@ -11,15 +11,13 @@
</div>
</div>
<!-- Used for the fixed title -->
<div class="col-md-2 col-sm-3 col-xs-3 fake-title-block"></div>
<!-- We need to reset col-md-* because my-search is in fixed position -->
<my-search class="col-md-10 col-sm-9 col-xs-9"></my-search>
<div class="header-right">
<my-search></my-search>
</div>
</div>
<div class="row">
<div class="col-md-2 col-sm-3 col-xs-3 title-menu-left">
<div class="row sub-header-container">
<div class="title-menu-left">
<div class="title-menu-left-block menu">
<my-menu *ngIf="isMenuDisplayed && isInAdmin() === false"></my-menu>
@ -27,10 +25,6 @@
</div>
</div>
<!-- Used for the fixed menu -->
<div class="fake-menu col-md-2 col-sm-3 col-xs-3">
</div>
<div class="main-col" [ngClass]="getMainColClasses()">
<div class="main-row">

View File

@ -2,10 +2,23 @@
min-height: calc(100vh - #{$header-height} - #{$footer-height} - #{$footer-margin});
}
.main-col {
margin-left: $menu-width;
&.expanded {
margin-left: 0;
}
}
.sub-header-container {
margin-top: $header-height;
}
.title-menu-left {
position: fixed;
height: calc(100vh - #{$header-height});
padding: 0;
width: $menu-width;
.title-menu-left-block.menu {
height: 100%;
@ -14,35 +27,28 @@
.header {
height: $header-height;
.fake-title-block {
display: inline-block;
}
position: fixed;
width: 100%;
background-color: #fff;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
display: flex;
.top-left-block {
z-index: 100;
background-color: #fff;
border-right: 1px solid $header-border-color;
width: $menu-width;
z-index: 1001;
height: $header-height;
line-height: $header-height;
margin-top: 0;
margin-bottom: 0;
display: flex;
position: fixed;
padding: 0;
&.border-bottom {
border-bottom: 1px solid $header-border-color;
}
.hamburger-block {
margin-right: 15px;
margin-left: 15px;
margin-right: 10px;
margin-left: 25px;
.glyphicon {
cursor: pointer;
position: relative;
top: 4px;
}
}
@ -50,12 +56,9 @@
a {
color: inherit !important;
display: block;
background: url('../assets/logo.png') no-repeat;
background-size: contain;
background-position: center;
height: 100%;
margin: auto;
width: 135px;
background: url('../assets/logo.svg') no-repeat;
width: 24px;
height: 24px;
&:hover {
color: inherit !important;
@ -122,17 +125,11 @@
}
}
my-search {
position: fixed;
z-index: 1000;
// Fix col-md-* padding
padding: 0;
}
.search-col {
height: 100%;
margin-left: -15px;
padding: 0;
.header-right {
text-align: right;
height: $header-height;
margin-left: $menu-width;
flex-grow: 1;
}
}

View File

@ -1,8 +1,6 @@
import { Component, OnInit } from '@angular/core'
import { Router } from '@angular/router'
import { AuthService, ServerService } from './core'
import { UserService } from './shared'
@Component({
selector: 'my-app',
@ -62,20 +60,9 @@ export class AppComponent implements OnInit {
}
getMainColClasses () {
const colSizes = {
md: 10,
sm: 9,
xs: 9
}
// Take all width is the menu is not displayed
if (this.isMenuDisplayed === false) {
Object.keys(colSizes).forEach(col => colSizes[col] = 12)
}
if (this.isMenuDisplayed === false) return [ 'expanded' ]
const classes = []
Object.keys(colSizes).forEach(col => classes.push(`col-${col}-${colSizes[col]}`))
return classes
return []
}
}

View File

@ -20,6 +20,7 @@ import { LoginModule } from './login'
import { SignupModule } from './signup'
import { SharedModule } from './shared'
import { VideosModule } from './videos'
import { MenuComponent, MenuAdminComponent } from './menu'
export function metaFactory (): MetaLoader {
return new MetaStaticLoader({
@ -47,7 +48,10 @@ const APP_PROVIDERS = [
@NgModule({
bootstrap: [ AppComponent ],
declarations: [
AppComponent
AppComponent,
MenuComponent,
MenuAdminComponent
],
imports: [
BrowserModule,

View File

@ -26,17 +26,13 @@ import { throwIfAlreadyLoaded } from './module-import-guard'
],
declarations: [
ConfirmComponent,
MenuComponent,
MenuAdminComponent
ConfirmComponent
],
exports: [
SimpleNotificationsModule,
ConfirmComponent,
MenuComponent,
MenuAdminComponent
ConfirmComponent
],
providers: [

View File

@ -1,6 +1,5 @@
export * from './auth'
export * from './server'
export * from './confirm'
export * from './menu'
export * from './routing'
export * from './core.module'

View File

@ -1,55 +0,0 @@
<menu>
<div class="panel-block">
<div class="block-title">Account</div>
<div id="panel-user-login" class="panel-button">
<a *ngIf="!isLoggedIn" routerLink="/login" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-log-in"></span>
Login
</a>
<a *ngIf="isLoggedIn" (click)="logout()">
<span class="hidden-xs glyphicon glyphicon-log-out"></span>
Logout
</a>
</div>
<a *ngIf="!isLoggedIn && isRegistrationAllowed()" routerLink="/signup" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-user"></span>
Signup
</a>
<a *ngIf="isLoggedIn" routerLink="/account" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-user"></span>
My account
</a>
<a *ngIf="isLoggedIn" routerLink="/videos/mine" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-folder-open"></span>
My videos
</a>
</div>
<div class="panel-block">
<div class="block-title">Videos</div>
<a routerLink="/videos/list" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-list"></span>
See videos
</a>
<a *ngIf="isLoggedIn" routerLink="/videos/upload" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-cloud-upload"></span>
Upload a video
</a>
</div>
<div *ngIf="userHasAdminAccess" class="panel-block">
<div class="block-title">Other</div>
<a [routerLink]="getFirstAdminRouteAvailable()" routerLinkActive="active">
<span class="hidden-xs glyphicon glyphicon-cog"></span>
Administration
</a>
</div>
</menu>

View File

@ -1,51 +0,0 @@
menu {
background-color: $black-background;
padding: 15px;
margin: 0;
height: 100%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
z-index: 1000;
@media screen and (max-width: 550px) {
font-size: 90%;
}
@media screen and (min-width: 1200px) {
padding: 25px;
}
.panel-block {
margin-bottom: 15px;
}
.block-title {
text-transform: uppercase;
font-weight: bold;
color: $menu-color-block;
margin-bottom: 10px;
}
a {
display: block;
margin-left: 5px;
height: 30px;
color: $menu-color-link;
cursor: pointer;
transition: color 0.3s;
&:hover, &:focus {
text-decoration: none !important;
outline: none !important;
}
.glyphicon {
margin-right: 15px;
}
&:hover, &.active {
color: #fff;
}
}
}

View File

@ -1,7 +1,7 @@
import { Component } from '@angular/core'
import { AuthService } from '../auth/auth.service'
import { UserRight } from '../../../../../shared'
import { AuthService } from '../core/auth/auth.service'
import { UserRight } from '../../../../shared'
@Component({
selector: 'my-menu-admin',

View File

@ -0,0 +1,48 @@
<menu>
<div *ngIf="isLoggedIn" class="logged-in-block">
<div class="logged-in-info">
<div class="logged-in-username">{{ user.username }}</div>
<div class="logged-in-email">{{ user.email }}</div>
</div>
<div class="logged-in-more" dropdown placement="right" container="body">
<span class="glyphicon glyphicon-option-vertical" dropdownToggle></span>
<ul *dropdownMenu class="dropdown-menu">
<li>
<a (click)="logout($event)" class="dropdown-item" title="Log out" href="#">
Log out
</a>
</li>
</ul>
</div>
</div>
<div *ngIf="!isLoggedIn" class="button-block">
<a routerLink="/login"class="login-button">Login</a>
<a *ngIf="isRegistrationAllowed()" routerLink="/signup" class="create-account-button">Create an account</a>
</div>
<div class="panel-block">
<div class="block-title">Videos</div>
<a routerLink="/videos/list" routerLinkActive="active">
<span class="icon icon-videos-trending"></span>
Trending
</a>
<a routerLink="/videos/list" routerLinkActive="active">
<span class="icon icon-videos-recently-added"></span>
Recently added
</a>
</div>
<div *ngIf="userHasAdminAccess" class="panel-block">
<div class="block-title">More</div>
<a [routerLink]="getFirstAdminRouteAvailable()" routerLinkActive="active">
<span class="icon icon-administration"></span>
Administration
</a>
</div>
</menu>

View File

@ -0,0 +1,131 @@
menu {
background-color: $black-background;
margin: 0;
padding: 0;
height: 100%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
z-index: 1000;
color: $menu-color;
@media screen and (max-width: 550px) {
font-size: 90%;
}
.logged-in-block {
height: 100px;
background-color: rgba(255, 255, 255, 0.15);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 35px;
.logged-in-info {
flex-grow: 1;
margin-left: 40px;
.logged-in-username {
font-size: 16px;
font-weight: $font-semibold;
}
.logged-in-email {
font-size: 13px;
color: #C6C6C6;
}
}
.logged-in-more {
margin-right: 20px;
.glyphicon {
cursor: pointer;
font-size: 18px;
}
}
}
.button-block {
margin: 30px 25px 35px 25px;
.login-button, .create-account-button {
font-weight: $font-semibold;
font-size: 15px;
height: $button-height;
line-height: $button-height;
width: 190px;
border-radius: 3px;
text-align: center;
&.login-button {
background-color: $orange-color;
margin-bottom: 10px;
}
&.create-account-button {
background-color: rgba(255, 255, 255, 0.25);
}
}
}
.block-title {
text-transform: uppercase;
font-weight: $font-bold; // Bold
font-size: 13px;
margin-bottom: 25px;
}
.panel-block {
margin-bottom: 45px;
margin-left: 26px;
a {
display: flex;
.icon {
width: 22px;
height: 22px;
display: inline-block;
margin-right: 18px;
background-size: contain;
&.icon-videos-trending {
position: relative;
top: -2px;
background-image: url('../../assets/menu/trending.svg');
}
&.icon-videos-recently-added {
width: 23px;
height: 23px;
position: relative;
top: -1px;
background-image: url('../../assets/menu/recently-added.svg');
}
&.icon-administration {
width: 23px;
height: 23px;
background-image: url('../../assets/menu/administration.svg');
}
}
}
}
a {
color: $menu-color;
height: 22px;
line-height: 22px;
display: block;
font-size: 16px;
cursor: pointer;
margin-bottom: 15px;
&:hover, &:focus {
text-decoration: none !important;
outline: none !important;
}
}
}

View File

@ -1,9 +1,8 @@
import { Component, OnInit } from '@angular/core'
import { Router } from '@angular/router'
import { AuthService, AuthStatus } from '../auth'
import { ServerService } from '../server'
import { UserRight } from '../../../../../shared/models/users/user-right.enum'
import { UserRight } from '../../../../shared/models/users/user-right.enum'
import { AuthService, AuthStatus, ServerService } from '../core'
import { User } from '../shared/users/user.model'
@Component({
selector: 'my-menu',
@ -11,6 +10,7 @@ import { UserRight } from '../../../../../shared/models/users/user-right.enum'
styleUrls: [ './menu.component.scss' ]
})
export class MenuComponent implements OnInit {
user: User
isLoggedIn: boolean
userHasAdminAccess = false
@ -29,16 +29,19 @@ export class MenuComponent implements OnInit {
ngOnInit () {
this.isLoggedIn = this.authService.isLoggedIn()
if (this.isLoggedIn === true) this.user = this.authService.getUser()
this.computeIsUserHasAdminAccess()
this.authService.loginChangedSource.subscribe(
status => {
if (status === AuthStatus.LoggedIn) {
this.isLoggedIn = true
this.user = this.authService.getUser()
this.computeIsUserHasAdminAccess()
console.log('Logged in.')
} else if (status === AuthStatus.LoggedOut) {
this.isLoggedIn = false
this.user = undefined
this.computeIsUserHasAdminAccess()
console.log('Logged out.')
} else {
@ -78,7 +81,9 @@ export class MenuComponent implements OnInit {
return this.routesPerRight[right]
}
logout () {
logout (event: Event) {
event.preventDefault()
this.authService.logout()
// Redirect to home page
this.router.navigate(['/videos/list'])

View File

@ -1,22 +1,6 @@
<div class="input-group">
<input
type="text" id="search-video" name="search-video" placeholder="Search"
[(ngModel)]="searchCriteria.value" (keyup.enter)="doSearch()"
>
<span class="hidden-xs input-group-addon icon-addon">
<span class="glyphicon glyphicon-search"></span>
</span>
<input
type="text" id="search-video" name="search-video" class="form-control" placeholder="Search" class="form-control"
[(ngModel)]="searchCriteria.value" (keyup.enter)="doSearch()"
>
<div class="input-group-btn" dropdown placement="bottom right">
<button id="simple-btn-keyboard-nav" type="button" class="btn btn-default" dropdownToggle>
{{ getStringChoice(searchCriteria.field) }} <span class="caret"></span>
</button>
<ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="simple-btn-keyboard-nav" *dropdownMenu>
<li *ngFor="let choice of choiceKeys" class="dropdown-item" role="menu-item">
<a class="dropdown-item" href="#" (click)="choose($event, choice)">{{ getStringChoice(choice) }}</a>
</li>
</ul>
</div>
</div>
<a routerLink="/videos/upload">Upload</a>

View File

@ -1,51 +0,0 @@
.icon-addon {
background-color: #fff;
border-radius: 0;
border-color: $header-border-color;
border-width: 0 0 1px 0;
text-align: right;
.glyphicon-search {
width: 30px;
font-size: 20px;
}
}
input, button, .input-group {
height: 100%;
}
input, .input-group-btn {
border-radius: 0;
border-top: none;
border-left: none;
}
input {
height: $header-height;
border-right: none;
font-weight: bold;
box-shadow: none;
&, &:focus {
border-bottom: 1px solid $header-border-color !important;
outline: none !important;
box-shadow: none !important;
}
}
button {
&, &:hover, &:focus, &:active, &:visited {
background-color: #fff !important;
border-color: $header-border-color !important;
color: #858585 !important;
outline: none !important;
height: $header-height;
border-width: 0 0 1px 0;
font-weight: bold;
text-decoration: none;
box-shadow: none;
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 838 B

118
client/src/assets/logo.svg Normal file
View File

@ -0,0 +1,118 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
viewBox="2799 -911 16 22"
version="1.1"
id="svg13"
sodipodi:docname="logo.svg"
width="16"
height="22"
inkscape:version="0.92.2 5c3e80d, 2017-08-06">
<metadata
id="metadata17">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1916"
inkscape:window-height="1040"
id="namedview15"
showgrid="false"
inkscape:zoom="29.790476"
inkscape:cx="-1.1827326"
inkscape:cy="12.088"
inkscape:window-x="0"
inkscape:window-y="18"
inkscape:window-maximized="0"
inkscape:current-layer="svg13" />
<defs
id="defs4">
<style
id="style2">
.cls-3 {
fill: #211f20;
}
.cls-4 {
fill: #737373;
}
.cls-5 {
fill: #f1680d;
}
.cls-6 {
fill: #fff;
}
</style>
</defs>
<g
id="Artboard_1"
data-name="Artboard 1"
class="cls-1"
transform="translate(0.03356777,-1.9929667)">
<g
id="Symbol_3_1"
data-name="Symbol 3 1"
transform="translate(2759,-975)">
<g
id="Group_44"
data-name="Group 44"
transform="translate(0,2.333)">
<path
id="Path_4"
data-name="Path 4"
class="cls-3"
d="m -949,-500 v 10.667 l 8,-5.333"
transform="translate(989,564)"
inkscape:connector-curvature="0"
style="fill:#211f20" />
<path
id="Path_5"
data-name="Path 5"
class="cls-4"
d="m -949,-500 v 10.667 l 8,-5.333"
transform="translate(989,574.667)"
inkscape:connector-curvature="0"
style="fill:#737373" />
<path
id="Path_6"
data-name="Path 6"
class="cls-5"
d="m -949,-500 v 10.667 l 8,-5.333"
transform="translate(997,569.333)"
inkscape:connector-curvature="0"
style="fill:#f1680d" />
<path
id="Path_7"
data-name="Path 7"
class="cls-6"
d="M 0,0 V 10.667 L 8,5.333 Z"
transform="rotate(180,24,40)"
inkscape:connector-curvature="0"
style="fill:#ffffff" />
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.0 KiB

View File

@ -0,0 +1,14 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>filter</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-444.000000, -247.000000)" fill="#808080">
<g id="70" transform="translate(444.000000, 247.000000)">
<path d="M8.82929429,17 L20.0066023,17 C20.5552407,17 21,17.4438648 21,18 C21,18.5522847 20.5550537,19 20.0066023,19 L8.82929429,19 C8.41745788,20.1651924 7.30621883,21 6,21 C4.34314575,21 3,19.6568542 3,18 C3,16.3431458 4.34314575,15 6,15 C7.30621883,15 8.41745788,15.8348076 8.82929429,17 Z M9.17070571,13 L3.99339768,13 C3.44475929,13 3,12.5561352 3,12 C3,11.4477153 3.44494629,11 3.99339768,11 L9.17070571,11 C9.58254212,9.83480763 10.6937812,9 12,9 C13.3062188,9 14.4174579,9.83480763 14.8292943,11 L20.0066023,11 C20.5552407,11 21,11.4438648 21,12 C21,12.5522847 20.5550537,13 20.0066023,13 L14.8292943,13 C14.4174579,14.1651924 13.3062188,15 12,15 C10.6937812,15 9.58254212,14.1651924 9.17070571,13 Z M15.1659641,6.98648118 C15.1124525,6.99537358 15.05751,7 15.0014977,7 L3.99850233,7 C3.44704472,7 3,6.55613518 3,6 C3,5.44771525 3.44748943,5 3.99850233,5 L15.0014977,5 C15.0575314,5 15.1124871,5.00458274 15.1660053,5.01340035 C15.5740343,3.84121344 16.6887792,3 18,3 C19.6568542,3 21,4.34314575 21,6 C21,7.65685425 19.6568542,9 18,9 C16.688735,9 15.5739592,8.15872988 15.1659641,6.98648118 Z M18,7 C18.5522847,7 19,6.55228475 19,6 C19,5.44771525 18.5522847,5 18,5 C17.4477153,5 17,5.44771525 17,6 C17,6.55228475 17.4477153,7 18,7 Z M12,13 C12.5522847,13 13,12.5522847 13,12 C13,11.4477153 12.5522847,11 12,11 C11.4477153,11 11,11.4477153 11,12 C11,12.5522847 11.4477153,13 12,13 Z M6,19 C6.55228475,19 7,18.5522847 7,18 C7,17.4477153 6.55228475,17 6,17 C5.44771525,17 5,17.4477153 5,18 C5,18.5522847 5.44771525,19 6,19 Z" id="Combined-Shape"></path>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -0,0 +1,13 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-4" transform="translate(-92.000000, -115.000000)">
<g id="2" transform="translate(92.000000, 115.000000)">
<circle id="Oval-1" stroke="#808080" stroke-width="2" cx="12" cy="12" r="10"></circle>
<rect id="Rectangle-1" fill="#808080" x="11" y="7" width="2" height="10" rx="1"></rect>
<rect id="Rectangle-1" fill="#808080" x="7" y="11" width="10" height="2" rx="1"></rect>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 785 B

View File

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch -->
<title>graph</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
<g id="Artboard-4" transform="translate(-444.000000, -203.000000)" stroke-width="2" stroke="#808080">
<g id="50" transform="translate(444.000000, 203.000000)">
<polyline id="Path-96" points="3 3 3 21.006249 21.0246733 21.006249"></polyline>
<polyline id="Path-101" points="6 18 11 12 14 13 19 7"></polyline>
<polygon id="Path-102" points="20 9 20 6 17 6"></polygon>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 958 B

View File

@ -1,12 +1,19 @@
$grey-color: #555;
$font-regular: 400;
$font-semibold: 600;
$font-bold: 700;
$black-background: #1d2125;
$grey-color: #555;
$orange-color: #F1680D;
$black-background: #000;
$grey-background: #f6f2f2;
$menu-color-link: #9cabb8;
$menu-color-block: #686f77;
$button-height: 30px;
$header-height: 65px;
$menu-color: #fff;
$menu-width: 240px;
$header-height: 50px;
$header-border-color: #e9eff6;
$footer-height: 30px;

View File

@ -1,3 +1,5 @@
$FontPathSourceSansPro: "../fonts/source-sans-pro";
@import '~source-sans-pro/source-sans-pro';
@import '~primeng/resources/themes/bootstrap/theme.css';
@import '~primeng/resources/primeng.css';
@import '~video.js/dist/video-js.css';
@ -7,6 +9,12 @@
display: none !important;
}
body {
font-family: 'Source Sans Pro';
font-weight: $font-regular;
color: #000;
}
input.readonly {
/* Force blank on readonly inputs */
background-color: #fff !important;

View File

@ -4708,9 +4708,9 @@ ngc-webpack@3.2.2:
source-map "^0.5.6"
ts-node "^3.2.0"
ngx-bootstrap@1.9.3:
version "1.9.3"
resolved "https://registry.yarnpkg.com/ngx-bootstrap/-/ngx-bootstrap-1.9.3.tgz#28e75d14fb1beaee609383d7694de4eb3ba03b26"
ngx-bootstrap@2.0.0-beta.9:
version "2.0.0-beta.9"
resolved "https://registry.yarnpkg.com/ngx-bootstrap/-/ngx-bootstrap-2.0.0-beta.9.tgz#9aa7c88269534e7a5440481f31b137549f749796"
ngx-chips@1.5.3:
version "1.5.3"
@ -6602,6 +6602,10 @@ source-map@^0.6.1, source-map@~0.6.1:
version "0.6.1"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
source-sans-pro@^2.0.10:
version "2.0.10"
resolved "https://registry.yarnpkg.com/source-sans-pro/-/source-sans-pro-2.0.10.tgz#c1ca859cf164a088944c5e83745085e87cd533a9"
spdx-correct@~1.0.0:
version "1.0.2"
resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-1.0.2.tgz#4b3073d933ff51f3912f03ac5519498a4150db40"