Leahnaya/chaoticbackup.github.io
1
0
Fork 0
mirror of https://github.com/chaoticbackup/chaoticbackup.github.io.git synced 2026-03-21 17:24:14 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

added footer

Browse Source
This commit is contained in:
Daniel 2017-05-02 16:28:49 -04:00
parent 0c3d5d64e0
commit b9d04f02aa
5 changed files with 226 additions and 122 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
build/bundle.js
View File

File diff suppressed because one or more lines are too long

6
index.html
View File

@ -5,10 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Chaotic Backup Portal</title>
<meta name="description" content="Chaotic Backup - Portal to Perim">
<link rel="stylesheet" href="/portal/src/css/background.css">
<link rel="stylesheet" href="/portal/src/css/header.css">
<link rel="stylesheet" href="/src/css/background.css">
<link rel="stylesheet" href="/src/css/header.css">
<link rel="stylesheet" href="/portal/src/css/legacy.css">
<link rel="stylesheet" href="/src/css/legacy.css">
<style>
html, body, div, span, a, p, ul, li, h1, code, nav {
margin: 0;

121
src/components/App.js
View File

@ -80,58 +80,85 @@ function App({ children, routes }) {
</div>
<div className="pgBkgrnd-repeat-x">
<div className="img-bkgrnd">
<div className="legacy-header">
<div className="content-wrap">
<div className="header">
<div id="nav">
<div className="zero-clear-line headerSpriteNav-wrap">
<ul id="unity-sprite" className={language}>
<li id="unity-nav1" className={language}></li>
<li id="unity-nav2" className={language}><a href={ChangePage('collect')}><span>Collect</span></a></li>
<li id="unity-nav3" className={language}><a href={ChangePage('build')}><span>Build</span></a></li>
<li id="unity-nav4" className={language}><a href={ChangePage('trade')}><span>Trade</span></a></li>
<li id="unity-nav5" className={language}><a href={ChangePage('centerOval')}><span>Home</span></a></li>
<li id="unity-nav6" className={language}><a href={ChangePage('forum')}><span>Forums</span></a></li>
<li id="unity-nav7" className={language}><a href={ChangePage('portal')}><span>Portal</span></a></li>
<li id="unity-nav8" className={language}><a href={ChangePage('playNow')}><span>Play</span></a></li>
<li id="unity-nav9" className={language}></li>
</ul>
<ul id="unityETC-sprite" className={language}>
<li id="unity-nav10" className={language}><a href={ChangePage('enterTheCode')}><span>Enter the Code</span></a></li>
</ul>
<div className="legacy legacy-header">
<div className="header">
<div id="nav">
<div className="zero-clear-line headerSpriteNav-wrap">
<ul id="unity-sprite" className={language}>
<li id="unity-nav1" className={language}></li>
<li id="unity-nav2" className={language}><a href={ChangePage('collect')}><span>Collect</span></a></li>
<li id="unity-nav3" className={language}><a href={ChangePage('build')}><span>Build</span></a></li>
<li id="unity-nav4" className={language}><a href={ChangePage('trade')}><span>Trade</span></a></li>
<li id="unity-nav5" className={language}><a href={ChangePage('centerOval')}><span>Home</span></a></li>
<li id="unity-nav6" className={language}><a href={ChangePage('forum')}><span>Forums</span></a></li>
<li id="unity-nav7" className={language}><a href={ChangePage('portal')}><span>Portal</span></a></li>
<li id="unity-nav8" className={language}><a href={ChangePage('playNow')}><span>Play</span></a></li>
<li id="unity-nav9" className={language}></li>
</ul>
<ul id="unityETC-sprite" className={language}>
<li id="unity-nav10" className={language}><a href={ChangePage('enterTheCode')}><span>Enter the Code</span></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div style={s.root}>
<h1 style={s.title}>Single Page Apps for GitHub Pages</h1>
{/*
<Interactive
as="a"
href="https://github.com/rafrex/spa-github-pages"
style={s.repoLink}
{...s.link}
>https://github.com/rafrex/spa-github-pages</Interactive>
*/}
<nav style={s.mapMenu}>
{generateMapMenu()}
</nav>
{children}
{/*
<div style={s.creditLine}>
<Interactive
as="a"
href="http://www.rafaelpedicini.com"
interactiveChild
focus={{}}
touchActive={{}}
touchActiveTapOnly
>
Code and concept by <span {...s.childLink}>Rafael Pedicini</span>
</Interactive>
<div style={s.root}>
<h1 style={s.title}>Single Page Apps for GitHub Pages</h1>
{/*
<Interactive
as="a"
href="https://github.com/rafrex/spa-github-pages"
style={s.repoLink}
{...s.link}
>https://github.com/rafrex/spa-github-pages</Interactive>
*/}
<nav style={s.mapMenu}>
{generateMapMenu()}
</nav>
{children}
{/*
<div style={s.creditLine}>
<Interactive
as="a"
href="http://www.rafaelpedicini.com"
interactiveChild
focus={{}}
touchActive={{}}
touchActiveTapOnly
>
Code and concept by <span {...s.childLink}>Rafael Pedicini</span>
</Interactive>
</div>
*/}
</div>
<div style={{height: "150px"}} />
<div className="legacy legacy-footer">
<div className="footer-wrap">
<div className="footer-repeat-x">
<div className="footer-left">
<div className="footer-right">
<div className="footer-text">
<div className="footer-search"></div>
<div className="footer-nav">
<div className="copyright">
©2008 Chaotic USA Entertainment Group, Inc.
<br />
U.S. Pat 5810666 and 5954332 and other pending patent applications. All Rights Reserved.
</div>
</div>
<div className="footer-language">
<a href="javascript:showLanguageSelection();" className="page-options" title="Change Language">
<img src="http://web.archive.org/web/20130304153151im_/http://chaoticgame.com/Images/flag_usa_.gif" alt="English (Change Language)" width="40" height="27"/>
<br />English (Change Language)
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
*/}
</div>
</div>
</div>

45
src/css/background.css
View File

@ -1,45 +0,0 @@
.fix-pgBkgrnd-repeat-x {
width:100%; height:100%;
position:fixed; top:0; left:0; z-index:-2;
background-image:url(https://chaoticbackup.github.io/portal/src/img/bkgrnd-repeat-x.jpg);
background-position: top left;
background-repeat:repeat-x;
float:left; clear:both;
overflow:none;
}
.fix-img-bkgrnd {
width:100%; height:100%;
position:absolute; top:0; left:0; z-index:-1;
background-position: center 0;
background-repeat: no-repeat;
float:left; clear:both;
overflow:none;
}
.fix-img-bkgrnd_01 {
background-image:url(https://chaoticbackup.github.io/portal/src/img/visual-bkgrnd.jpg);
background-position: center 212px;
}
.fix-img-bkgrnd_02 {
background-image:url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/visual-bkgrnd_02.jpg);
background-position: center 1px;
}
.fix-img-bkgrnd_03 {
background-image:url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/visual-bkgrnd_03.jpg);
}
.fix-img-bkgrnd_04 {
background-image:url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/visual-bkgrnd_04.jpg);
}
.fix-img-bkgrnd_05 {
background-image:url(https://chaoticbackup.github.io/portal/src/img/visual-bkgrnd_05.jpg);
}
.fix-img-bkgrnd_german_01 {
background-image:url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/visual-bkgrnd_german_01.jpg);
}
.pgBkgrnd-repeat-x {
width:100%; z-index:0;
float:left; clear:both;
}
.img-bkgrnd {
width:100%; z-index:2;
float:left; clear:both;
}

166
src/css/header.css → src/css/legacy.css
View File

@ -1,36 +1,92 @@
/* CSS Document */
p, div, li {
/*-------------- Structural Framework --------------*/
/*------------------------------------------------------*/
.legacy p, .legacy div, .legacy li {
font-family:Arial, Helvetica, sans-serif;
font-size: 10px; line-height: 14px; color: #FFFFFF;
}
/*-------------- Structural Framework --------------*/
/*------------------------------------------------------*/
/*-------------- Page Shell --------------*/
.content-wrap {
z-index:2;
position:absolute; top:0;
margin-left:50%; margin-right:50%;
left:-492px;
clear:both;
}
.content-wrap .legacy {
width:975px;
}
/*-------------- Background --------------*/
.fix-pgBkgrnd-repeat-x {
width:100%; height:100%;
position:fixed; top:0; left:0; z-index:-2;
background-image:url(https://chaoticbackup.github.io/portal/src/img/bkgrnd-repeat-x.jpg);
background-position: top left;
background-repeat:repeat-x;
float:left; clear:both;
overflow:none;
}
.fix-img-bkgrnd {
width:100%; height:100%;
position:absolute; top:0; left:0; z-index:-1;
background-position: center 0;
background-repeat: no-repeat;
float:left; clear:both;
overflow:none;
}
.fix-img-bkgrnd_01 {
background-image:url(https://chaoticbackup.github.io/portal/src/img/visual-bkgrnd.jpg);
background-position: center 212px;
}
.fix-img-bkgrnd_02 {
background-image:url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/visual-bkgrnd_02.jpg);
background-position: center 1px;
}
.fix-img-bkgrnd_03 {
background-image:url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/visual-bkgrnd_03.jpg);
}
.fix-img-bkgrnd_04 {
background-image:url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/visual-bkgrnd_04.jpg);
}
.fix-img-bkgrnd_05 {
background-image:url(https://chaoticbackup.github.io/portal/src/img/visual-bkgrnd_05.jpg);
}
.fix-img-bkgrnd_german_01 {
background-image:url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/visual-bkgrnd_german_01.jpg);
}
.pgBkgrnd-repeat-x {
width:100%; z-index:0;
float:left; clear:both;
}
.img-bkgrnd {
width:100%; z-index:2;
float:left; clear:both;
}
/*-------------- Header --------------*/
.legacy-header {
height:170px;
margin-top:10px;
/*background-color:#494949;*/
margin: 0 auto; padding: 0;
}
.content-wrap {
width:975px; z-index:2;
margin-left:50%; margin-right:50%;
position:absolute; top:0; left:-487px;
clear:both;
}
.header {
width: 975px; height: 157px;
text-align:center;
float: left;
height:200px;
margin-top:10px;
/*background-color:#494949;*/
margin: 0 auto; padding: 0;
}
.header {
width: 975px; height: 157px;
text-align:center;
float: left;
}
.headerSpriteNav-wrap {
width:950px;
height:170px;
margin:0 auto;
}
/*-------------- Localized Sprite Nav(s) --------------*/
#unity-sprite {
width: 950px; height: 170px;
margin: 0; padding: 0;
@ -180,3 +236,71 @@ p, div, li {
#unityETC-sprite.SPA { background: url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/unity-sprite-nav_Spanish.png) -341px -120px no-repeat; }
#unity-nav10.SPA a:hover {background: transparent url(http://web.archive.org/web/20120207003733im_/http://www.chaoticgame.com/Images/unity-sprite-nav_Spanish.png) -341px -290px; background-repeat:no-repeat;}
/*-------------- Footer --------------*/
/*------------------------------------------------------*/
.footer-wrap {
max-width: 943px; height:54px;
margin: 0 auto;
clear: both;
}
.footer-repeat-x {
width: 100%; height:54px;
background-image:url(http://web.archive.org/web/20130304153141im_/http://chaoticgame.com/Images/footer-repeat-x.gif);
background-position: left top;
background-repeat:repeat-x;
}
.footer-left {
width: 100%; height:54px;
background-image:url(http://web.archive.org/web/20130304153141im_/http://chaoticgame.com/Images/footer-left.gif);
background-position: left top;
background-repeat:no-repeat;
}
.footer-right {
width: 100%; height:54px;
background-image:url(http://web.archive.org/web/20130304153141im_/http://chaoticgame.com/Images/footer-right.gif);
background-position: right top;
background-repeat:no-repeat;
}
.footer-text {
width:100%; height:54px;
margin:0px auto;
float:left; clear: both;
}
.footer-search {
width:211px; height:52px;
color: #FFFFFF; text-align: center;
padding-top:2px; float: left;
}
.footer-nav {
width:492px; /*height:27px; */line-height:14px;
color: #FFFFFF; padding-top:27px; text-align: center;
margin:0 6px 0 6px; float:left;
}
.footer-nav a:link, .footer-nav a:visited {
color:#FFFFFF;
text-decoration: underline;
}
.footer-nav a:hover, .footer-nav a:active {
color:#99ffff;
text-decoration: underline;
}
.footer-language {
width:205px; height:50px;
color: #FFFFFF; text-align: center;
padding-top:6px; float: left;
}
.copyright {
/* width: 955px;*/
margin: 0 auto; text-align:center;
/* padding:10px;*/
}
.copyright a:link, .copyright a:visited {
color: #FFFFFF;
text-decoration: none;
}
.copyright a:hover, .copyright a:active {
color:#FFFFFF;
text-decoration: underline;
}