Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2024-11-25 10:03:45 +03:00
Code Issues Packages Projects Releases Wiki Activity

Added some styling

Browse Source
This commit is contained in:
Roman Gotsiy 2015-10-10 15:34:46 +03:00
parent a2fe4c9ca4
commit ff437c9b00
7 changed files with 63 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
demo/index.html
View File

@ -2,6 +2,7 @@
<html> <html>
<head> <head>
<title>ReDoc prototype</title> <title>ReDoc prototype</title>
<link rel="stylesheet" href="main.css">
</head> </head>
<body> <body>
<!-- The wrapper component --> <!-- The wrapper component -->

6
demo/main.css Normal file
View File

@ -0,0 +1,6 @@
body {
font-family: Verdana, Geneva, sans-serif;
font-size: 14px;
padding: 10px 20px;
color: #333;
}

2
lib/components/ApiInfo/api-info.html
View File

@ -2,7 +2,7 @@
<p *ng-if="data.description"> {{data.description}} </p> <p *ng-if="data.description"> {{data.description}} </p>
<p> <p>
<!-- TODO: create separate components for contact and license ? --> <!-- TODO: create separate components for contact and license ? -->
<span *ng-if="data.contact"> Contatct: <span *ng-if="data.contact"> Contact:
<a *ng-if="data.contact.url" href="{{data.contact.url}}"> <a *ng-if="data.contact.url" href="{{data.contact.url}}">
{{data.contact.name || data.contact.url}}</a> {{data.contact.name || data.contact.url}}</a>
<a *ng-if="data.contact.email" href="mailto:{{data.contact.email}}"> <a *ng-if="data.contact.email" href="mailto:{{data.contact.email}}">

44
lib/components/Method/method.css Normal file
View File

@ -0,0 +1,44 @@
h2 {
font-size: 32px;
font-weight: 200;
}
h3 {
margin: 0;
font-weight: 200;
}
h3 > span {
padding: 5px 10px;
vertical-align: middle;
}
.http-method {
font-size: 13px;
color: white;
background-color: #1976D3;
}
.http-method.delete {
background-color: red;
}
.http-method.post {
background-color: green;
}
.http-method.patch {
background-color: orange;
}
.http-method.put {
background-color: crimson;
}
.http-method.options {
background-color: black;
}
.http-method.head {
background-color: darkkhaki;
}

13
lib/components/Method/method.html
View File

@ -1,7 +1,8 @@
<div> <h2>{{data.methodInfo.summary}}</h2>
<h2>{{data.methodInfo.summary}}</h2> <h3>
<p> <strong>{{data.method}}</strong> <code>{{data.path}}</code> </p> <span class="http-method" [ng-class]="data.method">{{data.method}}</span>
<p class="description"> <span class="path">{{data.path}}</span>
</h3>
<p class="method-summary">
{{data.methodInfo.description}} {{data.methodInfo.description}}
</p> </p>
</div>

3
lib/components/Method/method.js
View File

@ -5,7 +5,8 @@ import {RedocComponent, BaseComponent} from '../base';
@RedocComponent({ @RedocComponent({
selector: 'method', selector: 'method',
templateUrl: './lib/components/Method/method.html' templateUrl: './lib/components/Method/method.html',
styleUrls: ['./lib/components/Method/method.css']
}) })
export class Method extends BaseComponent { export class Method extends BaseComponent {
constructor(schemaMgr) { constructor(schemaMgr) {

1
lib/components/MethodsList/methods-list.js
View File

@ -20,5 +20,6 @@ export class MethodsList extends BaseComponent {
let pathInfo = this.componentSchema; let pathInfo = this.componentSchema;
this.data.methods = Object.keys(pathInfo).filter((k) => swaggerMethods.has(k)); this.data.methods = Object.keys(pathInfo).filter((k) => swaggerMethods.has(k));
// TODO: check $ref field
} }
} }