kubernetes
/
website
mirror of https://github.com/kubernetes/website.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #208 from janetkuo/update-demo-page 

Styling the update-demo static page
pull/216/head
johndmulhausen 2016-03-21 15:05:39 -07:00
parent 2aee7636f9 0e3b9129b9
commit 5bc866f76d
2 changed files with 41 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
docs/user-guide/update-demo/local/index.html
View File

@ -23,14 +23,26 @@ limitations under the License.
<body ng-controller="ButtonsCtrl">
<div ng-repeat="server in servers" class="pod">
<img src="/api/v1/proxy/namespaces/default/pods/{{server.podName}}/{{server.image}}" height="100px" width="100px" />
<b>ID:</b> {{server.podName}}<br>
<b>Host:</b> <a href="/api/v1/proxy/namespaces/default/pods/{{server.podName}}/data.json">{{server.host}}</a><br>
<b>Status:</b> {{server.status}}<br>
<b>Image:</b> {{server.dockerImage}}<br>
<b>Labels:</b>
<ul>
<li ng-repeat="(key,value) in server.labels">{{key}}={{value}}</li>
</ul>
<div class="k8s-example-update-demo-card-section">
<span class="k8s-title">ID</span> <span>{{server.podName}}</span>
</div>
<div class="k8s-example-update-demo-card-section">
<span class="k8s-title">Host</span> <span><a href="/api/v1/proxy/namespaces/default/pods/{{server.podName}}/data.json">{{server.host}}</a></span>
</div>
<div class="k8s-example-update-demo-card-section">
<span class="k8s-title">Status</span> <span>{{server.status}}</span>
</div>
<div class="k8s-example-update-demo-card-section">
<span class="k8s-title">Image</span> <span>{{server.dockerImage}}</span>
</div>
<div class="k8s-example-update-demo-card-section">
<span class="k8s-title">Labels</span>
<span>
<ul>
<li ng-repeat="(key,value) in server.labels">{{key}}={{value}}</li>
</ul>
</span>
</div>
</div>
</body>
</html>

23
docs/user-guide/update-demo/local/style.css
View File

@ -19,9 +19,9 @@ img {
width: 100px;
float: right;
background-size: 100px 100px;
background-color: black;
margin-left: 10px;
border: none;
border-radius: 50%;
}
ul {
@ -33,8 +33,27 @@ ul {
font-family: Roboto, Open Sans, arial;
border: 1px solid black;
border-radius: 5px;
border: 1px groove #DCDDDE;
padding: 10px;
margin: 10px;
display: inline-block;
background-color: #D1D1D1;
box-shadow: 3px 3px 3px 1px #CFCFCF;
background-color: #FFFFFF;
}
body {
background-color: #E8E8E8;
}
.k8s-example-update-demo-card-section {
color: black;
font-size: 13px;
}
.k8s-example-update-demo-card-section .k8s-title {
color: #7D7D7D;
}
.k8s-example-update-demo-card-section .k8s-card-id {
font-size: bigger;
}