Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2025-02-27 07:20:33 +03:00
Code Issues Packages Projects Releases Wiki Activity

UI fix: extra line at the last object property

Browse Source
This commit is contained in:
Roman Hotsiy 2016-03-27 00:45:28 +02:00
parent 6032355664
commit 422ef513a2
3 changed files with 35 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
lib/components/JsonSchema/json-schema-common.scss
View File

@ -133,7 +133,7 @@ $sub-schema-offset: ($bullet-size/2) + $bullet-margin;
height: ($param-name-height/2) + $cell-padding + 1; height: ($param-name-height/2) + $cell-padding + 1;
} }
.param:last-of-type > .param-name { .param:last-of-type > .param-name, .param.last > .param-name {
position: relative; position: relative;
&:after { &:after {
@ -156,6 +156,10 @@ $sub-schema-offset: ($bullet-size/2) + $bullet-margin;
display: none !important; display: none !important;
} }
.param-schema.last > td {
border-left: 0;
}
.param-enum { .param-enum {
color: $text-color; color: $text-color;
font-size: 13px; font-size: 13px;

27
lib/components/JsonSchema/json-schema.html
View File

@ -1,10 +1,17 @@
<span *ngIf="isTrivial" class="param-wrap"> <span *ngIf="schema.isTrivial" class="param-wrap">
<span class="param-type param-type-trivial {{type}}" <span class="param-type param-type-trivial {{schema.type}}"
[ngClass]="{'with-hint': _displayTypeHint}" title="{{_displayTypeHint}}">{{_displayType}}</span> [ngClass]="{'with-hint': schema._displayTypeHint}"
title="{{schema._displayTypeHint}}">{{schema._displayType}} {{schema._displayFormat}}
<span class="param-range" *ngIf="schema._range"> {{schema._range}} </span>
</span>
<div *ngIf="schema.enum" class="param-enum">
<span *ngFor="#enumItem of schema.enum" class="enum-value {{enumItem.type}}"> {{enumItem.val | json}} </span>
</div>
</span> </span>
<table *ngIf="!isTrivial" class="params-wrap" [ngClass]="{'params-array': isArray}"> <table *ngIf="!schema.isTrivial" class="params-wrap" [ngClass]="{'params-array': schema._isArray}">
<template ngFor [ngForOf]="data.properties" #prop="$implicit"> <caption> {{_displayType}} </caption>
<tr class="param" [ngClass]="{'discriminator': prop.isDiscriminator, 'complex': prop._pointer}"> <template ngFor [ngForOf]="schema.properties" #prop="$implicit" #last="last">
<tr class="param" [ngClass]="{'last': last, 'discriminator': prop.isDiscriminator, 'complex': prop._pointer}">
<td class="param-name"> <td class="param-name">
<span class="param-name-content">{{prop._name}}</span> <span class="param-name-content">{{prop._name}}</span>
</td> </td>
@ -23,22 +30,22 @@
<div class="discriminator-info" *ngIf="prop.isDiscriminator"> <div class="discriminator-info" *ngIf="prop.isDiscriminator">
This field value determines the exact schema: This field value determines the exact schema:
<ul> <ul>
<li *ngFor="#derived of data.derived" <li *ngFor="#derived of schema.derived"
(click)="selectDerived(derived)" [ngClass]="{active: derived.active}"> {{derived.name}} </li> (click)="selectDerived(derived)" [ngClass]="{active: derived.active}"> {{derived.name}} </li>
</ul> </ul>
</div> </div>
</td> </td>
</tr> </tr>
<tr class="param-schema" [ngClass]="{'param-array': prop._isArray}" *ngIf="prop._pointer"> <tr class="param-schema" [ngClass]="{'param-array': prop._isArray, 'last': last}" *ngIf="prop._pointer">
<td colspan="2"> <td colspan="2">
<json-schema pointer="{{prop._pointer}}" [isArray]='prop._isArray' class="nested-schema"> <json-schema pointer="{{prop._pointer}}" [isArray]='prop._isArray' class="nested-schema">
</json-schema> </json-schema>
</td> </td>
</tr> </tr>
</template> </template>
<tr *ngIf="data.derived.length" class="param-wrap discriminator-wrap"> <tr *ngIf="schema.derived.length" class="param-wrap discriminator-wrap">
<td colspan="2"> <td colspan="2">
<div class="derived-schema" *ngFor="#derived of data.derived" [ngClass]="{active: derived.active}"> <div class="derived-schema" *ngFor="#derived of schema.derived" [ngClass]="{active: derived.active}">
<json-schema pointer="{{derived.$ref}}" [final]="derived.final" class="discriminator-part"> <json-schema pointer="{{derived.$ref}}" [final]="derived.final" class="discriminator-part">
</json-schema> </json-schema>
</div> </div>

14
lib/components/JsonSchema/json-schema.scss
View File

@ -118,8 +118,20 @@ json-schema.nested-schema {
} }
.discriminator-wrap > td { .discriminator-wrap > td {
border-left: $line-border; //border-left: $line-border;
padding: 0; padding: 0;
position: relative;
&:before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
border-left: $line-border;
height: ($param-name-height/2) + $cell-padding + 1;
z-index: 1;
}
} }
ul { ul {