Make right panel fill all page

This commit is contained in:
Roman Hotsiy 2016-03-14 22:27:07 +02:00
parent a0a209820f
commit ca2c01b8ac
4 changed files with 43 additions and 51 deletions

View File

@ -1,15 +1,17 @@
<h1 class="api-info-header">{{data.title}} ({{data.version}})</h1>
<p *ngIf="data.description" innerHtml="{{data.description | marked}}"> </p>
<p>
<!-- TODO: create separate components for contact and license ? -->
<span *ngIf="data.contact"> Contact:
<a *ngIf="data.contact.url" href="{{data.contact.url}}">
{{data.contact.name || data.contact.url}}</a>
<a *ngIf="data.contact.email" href="mailto:{{data.contact.email}}">
{{data.contact.email}}</a>
</span>
<span *ngIf="data.license"> License:
<a *ngIf="data.license.url" href="{{data.license.url}}"> {{data.license.name}} </a>
<span *ngIf="!data.license.url"> {{data.license.name}} </span>
</span>
</p>
<div>
<h1 class="api-info-header">{{data.title}} ({{data.version}})</h1>
<p *ngIf="data.description" innerHtml="{{data.description | marked}}"> </p>
<p>
<!-- TODO: create separate components for contact and license ? -->
<span *ngIf="data.contact"> Contact:
<a *ngIf="data.contact.url" href="{{data.contact.url}}">
{{data.contact.name || data.contact.url}}</a>
<a *ngIf="data.contact.email" href="mailto:{{data.contact.email}}">
{{data.contact.email}}</a>
</span>
<span *ngIf="data.license"> License:
<a *ngIf="data.license.url" href="{{data.license.url}}"> {{data.license.name}} </a>
<span *ngIf="!data.license.url"> {{data.license.name}} </span>
</span>
</p>
</div>

View File

@ -3,3 +3,7 @@
.api-info-header {
font-weight: normal;
}
> div {
width: 60%;
}

View File

@ -5,6 +5,7 @@
padding: 40px;
box-sizing: border-box;
background-color: white;
width: 60%;
}
.tag-info:after, .tag-info:before {
@ -22,20 +23,3 @@
display: block;
position: relative;;
}
.methods:before {
content: "";
background: $samples-panel-bg-color;
height: 100%;
width: $samples-panel-width;
top: 0;
right: 0;
position: absolute;
z-index: -1;
}
@media (max-width: 1100px) {
.methods:before {
display: none;
}
}

View File

@ -55,28 +55,30 @@ api-logo {
}
#api-content {
margin-left: $side-bar-width;
@media (max-width: $side-menu-mobile-breakpoint) {
padding-top: 3em;
margin-left: 0;
}
margin-left: $side-bar-width;
position: relative;
@media (max-width: $side-menu-mobile-breakpoint) {
padding-top: 3em;
margin-left: 0;
}
}
#api-content:after {
content: "";
position: absolute;;
left:0;
right: 0;
top: 0;
bottom: 0;
background-color: black;
opacity: 0.5;
transition: all 0.3s ease;
#api-content:before {
content: "";
background: $samples-panel-bg-color;
height: 100%;
width: $samples-panel-width;
top: 0;
right: 0;
position: absolute;
z-index: -1;
}
@media (max-width: 1100px) {
#api-content:before {
display: none;
}
#api-content.menu-opened:after {
display: block;;
}
}
/* global redoc styles */