diff options
| author |   Michael Lando <ml636r@att.com> | 2018-05-21 20:19:48 +0000 |
|---|---|---|
| committer |   Gerrit Code Review <gerrit@onap.org> | 2018-05-21 20:19:48 +0000 |
| commit | 05b37297177e8a342668c15e5d6f738b51f7aedd (patch) | |
| tree | e236c96df52a13f935292db8aa73e84d0c41ad8a /utils/index-for-gh-pages.html | |
| parent | 884dfb789593d2a3cc319047ab1f0215778aec9f (diff) | |
| parent | 1994c98063c27a41797dec01f2ca9fcbe33ceab0 (diff) | |
Merge "init commit onap ui"HEAD2.0.0-ONAPmasterbeijing2.0.0-ONAP
Diffstat (limited to 'utils/index-for-gh-pages.html')
| -rw-r--r-- | utils/index-for-gh-pages.html | 98 |
1 files changed, 98 insertions, 0 deletions
diff --git a/utils/index-for-gh-pages.html b/utils/index-for-gh-pages.html new file mode 100644 index 0000000..a6d7f63 --- /dev/null +++ b/utils/index-for-gh-pages.html @@ -0,0 +1,98 @@ +<!DOCTYPE html> +<html> + +<head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <meta content="IE=edge" http-equiv="X-UA-Compatible" /> + <title>Storybook</title> + <style> + body, html { + width: 100%; + height: 100%; + padding: 0; + margin: 0; + } + .header { + display: flex; + padding: 18px 40px 0 40px; + } + .logo { + margin-right: 95px; + cursor: pointer; + } + img { + width: 125px; + height: 26px; + } + .showcase-header { + display: flex; + } + .case-tab-name { + font-family: OpenSans, OpenSans-Regular, 'Open Sans', Arial, sans-serif; + font-size: 14px; + line-height: 1.71; + letter-spacing: -0.2px; + margin: 0 20px; + padding: 4px 8px 12px 8px; + color: #5a5a5a; + cursor: pointer; + text-transform: uppercase; + } + .case-tab-name[active=true] { + color: #009fdb; + border-bottom: solid 2px #009fdb; + } + .showcase-wrapper { + height: calc(100% - 60px); + display: flex; + flex-direction: column; + background-color: #FFFFFF; + } + .showcase-iframe { + height: 100%; + border-top: solid 1px #aaaaaa; + } + </style> + + <script> + var shows = { + mainPage: "main-page.html", + react: "react/index.html", + angular: "angular/index.html" + }; + function show(type){ + document.getElementById('showcase').src = shows[type]; + setActiveTab(type); + } + function setActiveTab(type) { + var allTabs = document.getElementsByClassName('case-tab-name'); + for(var i = 0; i < allTabs.length; i++ ) { + if(allTabs[i].getAttribute('id') === type+'-tab') { + allTabs[i].setAttribute('active', true); + } + else { + allTabs[i].setAttribute('active', false); + } + } + } + </script> + +</head> + +<body> + <div class="header"> + <div class="logo" onClick="show('mainPage')"><img src="assets/images/logo_onap.png"/></div> + <div class="showcase-header"> + <div class="case-tab-name" id="react-tab" onClick="show('react')">React</div> + <div class="case-tab-name" id="angular-tab" onClick="show('angular')">Angular</div> + </div> + </div> + + <div class="showcase-wrapper"> + <iframe id="showcase" src="main-page.html" class="showcase-iframe"> + </iframe> + </div> +</body> + +</html> |