diff options
| author |   Israel Lavi <israel.lavi@intl.att.com> | 2018-05-21 17:42:00 +0300 |
|---|---|---|
| committer |   Israel Lavi <il0695@att.com> | 2018-05-21 17:52:01 +0300 |
| commit | 1994c98063c27a41797dec01f2ca9fcbe33ceab0 (patch) | |
| tree | f30beeaf15a8358f6da78fdd74bcbda74bd334f8 /utils/index-for-gh-pages.html | |
| parent | 4749f4631426fcbe29ed98cef8f24cab18b501d0 (diff) | |
init commit onap ui
Change-Id: I1dace78817dbba752c550c182dfea118b4a38646
Issue-ID: SDC-1350
Signed-off-by: Israel Lavi <il0695@att.com>
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> |