Update style and layout of header
This commit is contained in:
parent
9e49058cf9
commit
b5a8231a7a
8 changed files with 42 additions and 13 deletions
|
@ -101,7 +101,7 @@ class DimensionStore {
|
|||
return this.__Tokens.find({where:{scalarToken: scalarToken}}).then(token => {
|
||||
if (!token) return Promise.reject(new Error("Token not found"));
|
||||
return Promise.resolve(token.matrixUserId);
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<div class="header">
|
||||
<div class="title">
|
||||
<h2 class="pageName">{{ pageName }}</h2>
|
||||
<breadcrumb [allowBootstrap]="false"></breadcrumb>
|
||||
<breadcrumb [allowBootstrap]="true" class="dimension-breadcrumb"></breadcrumb>
|
||||
</div>
|
||||
<div class="quickAction">
|
||||
<ng-content></ng-content>
|
||||
|
|
|
@ -11,6 +11,7 @@
|
|||
margin: 0;
|
||||
width: 83.333333%; // col-sm-10
|
||||
padding: 15px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.header .title .pageName {
|
||||
|
@ -24,5 +25,7 @@
|
|||
margin: 0;
|
||||
float: right;
|
||||
text-align: right;
|
||||
width: 16.666667%; // col-sm-2
|
||||
display: inline-block;
|
||||
width: 15.666667%; // col-sm-2
|
||||
position: relative;
|
||||
}
|
|
@ -1,7 +1,7 @@
|
|||
<div id="wrapper">
|
||||
<my-scalar-close></my-scalar-close>
|
||||
|
||||
<my-page-header pageName="Dimension"></my-page-header>
|
||||
<my-page-header pageName="Dimension">
|
||||
<my-scalar-close class="closeButton"></my-scalar-close>
|
||||
</my-page-header>
|
||||
|
||||
<div class="page-content">
|
||||
<div *ngIf="isError">
|
||||
|
|
|
@ -1,10 +1,4 @@
|
|||
// component styles are encapsulated and only applied to their components
|
||||
my-scalar-close {
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
right: 15px;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
padding: 30px;
|
||||
}
|
|
@ -1 +1 @@
|
|||
<img src="/img/close.svg" (click)="closeScalar()">
|
||||
<img src="/img/close.svg" (click)="closeScalar()" alt="close" title="close" />
|
31
web/style/_riot.scss
Normal file
31
web/style/_riot.scss
Normal file
|
@ -0,0 +1,31 @@
|
|||
// The CSS for the Riot breadcrumb is specified here to ensure that it's style can be overridden.
|
||||
// In it's current position (as a component), the component-level stylesheet cannot access the
|
||||
// elements, so we specify it in a more generic location.
|
||||
|
||||
.dimension-breadcrumb {
|
||||
.fluid-bread {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.fluid-bread .container {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.fluid-bread .container .breadcrumb {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.fluid-bread .breadcrumb-item a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
font-size: 13px;
|
||||
display: block;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.header .quickAction .closeButton img {
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
right: 15px;
|
||||
}
|
|
@ -1,6 +1,7 @@
|
|||
// styles in src/style directory are applied to the whole page
|
||||
@import url('https://fonts.googleapis.com/css?family=Open+Sans:100|Roboto:300');
|
||||
@import '../../node_modules/angular2-toaster/toaster';
|
||||
@import "riot";
|
||||
|
||||
body {
|
||||
background: rgb(238, 238, 238) !important;
|
||||
|
|
Loading…
Reference in a new issue