Начало работы над интерфейсом.

This commit is contained in:
2017-05-11 00:09:50 +03:00
parent 7068d20183
commit ada109d090
7 changed files with 43 additions and 7 deletions

View File

@@ -12,11 +12,13 @@
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@angular/animations": "^4.1.1",
"@angular/common": "^4.0.0", "@angular/common": "^4.0.0",
"@angular/compiler": "^4.0.0", "@angular/compiler": "^4.0.0",
"@angular/core": "^4.0.0", "@angular/core": "^4.0.0",
"@angular/forms": "^4.0.0", "@angular/forms": "^4.0.0",
"@angular/http": "^4.0.0", "@angular/http": "^4.0.0",
"@angular/material": "^2.0.0-beta.3",
"@angular/platform-browser": "^4.0.0", "@angular/platform-browser": "^4.0.0",
"@angular/platform-browser-dynamic": "^4.0.0", "@angular/platform-browser-dynamic": "^4.0.0",
"@angular/router": "^4.0.0", "@angular/router": "^4.0.0",

View File

@@ -0,0 +1,4 @@
.app-content {
padding: 20px;
}

View File

@@ -1,3 +1,22 @@
<h1> <md-toolbar color="primary">
{{title}} <span>Log Manager</span>
</h1> <span style="flex: 1 1 auto;"></span>
<span><button md-raised-button color="warn">Выхода нет</button></span>
</md-toolbar>
<md-card>
<md-input-container>
<input mdInput placeholder="Пароль" type="password">
</md-input-container>
<button (click)="showCon=!showCon" md-raised-button>Расшифровать заголовки</button>
</md-card>
<div *ngIf="showCon;else empty" class="app-content">
<md-card>
<md-checkbox>Kek</md-checkbox><p></p>
<button md-raised-button>Toggle</button>
</md-card>
</div>
<ng-template #empty>
</ng-template>

View File

@@ -6,5 +6,5 @@ import { Component } from '@angular/core';
styleUrls: ['./app.component.css'] styleUrls: ['./app.component.css']
}) })
export class AppComponent { export class AppComponent {
title = 'app works!'; //title = 'app works!';
} }

View File

@@ -2,8 +2,11 @@ import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms'; import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http'; import { HttpModule } from '@angular/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MdButtonModule, MdCheckboxModule, MdToolbarModule, MdSidenavModule, MdCardModule} from '@angular/material';
import { AppComponent } from './app.component'; import { AppComponent } from './app.component';
import { MdInputModule } from "@angular/material";
@NgModule({ @NgModule({
declarations: [ declarations: [
@@ -12,7 +15,14 @@ import { AppComponent } from './app.component';
imports: [ imports: [
BrowserModule, BrowserModule,
FormsModule, FormsModule,
HttpModule BrowserAnimationsModule,
HttpModule,
MdButtonModule,
MdCheckboxModule,
MdToolbarModule,
MdSidenavModule,
MdCardModule,
MdInputModule
], ],
providers: [], providers: [],
bootstrap: [AppComponent] bootstrap: [AppComponent]

View File

@@ -2,13 +2,13 @@
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>MyDayz</title> <title>Log Manager</title>
<base href="/"> <base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico"> <link rel="icon" type="image/x-icon" href="favicon.ico">
</head> </head>
<body> <body style="margin: 0;">
<app-root>Loading...</app-root> <app-root>Loading...</app-root>
</body> </body>
</html> </html>

View File

@@ -1 +1,2 @@
/* You can add global styles to this file, and also import other style files */ /* You can add global styles to this file, and also import other style files */
@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';