sues_virtual_life: index

This commit is contained in:
marleyrae 2023-06-14 12:18:54 -07:00
parent e561163db4
commit 6621ccd0cb
14 changed files with 484 additions and 66 deletions

View file

@ -1,62 +1,64 @@
/*noinspection DuplicatedCode,CssUnresolvedCustomProperty*/ /*noinspection DuplicatedCode,CssUnresolvedCustomProperty*/
div#archive-menu { div#archive-menu {
position: fixed; position: fixed;
top: 20px; top: 20px;
right: 20px; right: 20px;
text-align: right; text-align: right;
font-size: 16px !important; font-size: 16px !important;
padding: 10px; padding: 10px;
overflow: hidden; overflow: hidden;
height: unset; height: unset;
width: unset; width: unset;
max-width: 0; max-width: 0;
max-height: 0; max-height: 0;
transition: max-height 0.5s ease-out, max-width 0.5s ease-out; transition: max-height 0.5s ease-out, max-width 0.5s ease-out;
border: 1px solid var(--border-color, var(--color, black)); border: 1px solid var(--border-color, var(--color, black));
background: var(--background-image, var(--background-color, white)); background: var(--background-image, var(--background-color, white));
background-attachment: fixed; background-attachment: fixed;
color: var(--color, black); color: var(--color, black);
} }
div#archive-menu a { div#archive-menu a {
display: block; display: block;
text-decoration: underline;
visibility: hidden; visibility: hidden;
transition: visibility 0s; transition: visibility 0s;
color: var(--color, black);
} }
div#archive-menu a:hover { div#archive-menu a:hover {
text-decoration: underline; text-decoration: underline;
text-decoration-style: wavy; text-decoration-style: wavy;
color: var(--color, black);
} }
div#archive-menu #hrt { div#archive-menu #hrt {
font-family: sans-serif !important; font-family: sans-serif !important;
display: block; display: block;
position: absolute; position: absolute;
top: -1px; top: -1px;
right: 5px; right: 5px;
opacity: 100%; opacity: 100%;
transition: opacity 0.5s ease-out; transition: opacity 0.5s ease-out;
} }
div#archive-menu:hover { div#archive-menu:hover {
max-width: 200px; max-width: 200px;
max-height: 200px; max-height: 200px;
transition: max-height 0.5s ease-in, max-width 0.5s ease-in; transition: max-height 0.5s ease-in, max-width 0.5s ease-in;
} }
div#archive-menu:hover a { div#archive-menu:hover a {
visibility: visible; visibility: visible;
transition-delay: 0.5s; transition-delay: 0.5s;
} }
div#archive-menu:hover #hrt { div#archive-menu:hover #hrt {
opacity: 0; opacity: 0;
transition: opacity 0.5s ease-in; transition: opacity 0.5s ease-in;
} }

View file

@ -0,0 +1,8 @@
INDEX
past
links
catz
dogz
other
babyz
archive

View file

@ -0,0 +1,46 @@
let currentPage = location.pathname.split('/').at(-2)
const waybackSiteBase = 'http://boardwalkerz.com/svl/'
const pageMetadata = {
sues_virtual_life: {
captureId: '20150810211140',
sourcePageName: '',
},
past: {
captureId: '',
sourcePageName: 'past.html',
},
links: {
captureId: '',
sourcePageName: 'links.html',
},
catz: {
captureId: '',
sourcePageName: 'catz.html',
},
dogz: {
captureId: '',
sourcePageName: 'dogz.html',
},
other: {
captureId: '',
sourcePageName: 'other.html',
},
babyz: {
captureId: '',
sourcePageName: 'babyz.html',
},
archive: {
captureId: '',
sourcePageName: 'archive.html',
},
}
export const wayback =
pageMetadata[currentPage].captureId
+ '/'
+ waybackSiteBase
+ pageMetadata[currentPage].sourcePageName

View file

@ -9,7 +9,13 @@ function html() {
return src(htmlFiles) return src(htmlFiles)
.pipe(posthtml([ .pipe(posthtml([
require('posthtml-urls')({ require('posthtml-urls')({
eachURL: (url) => url[0] === '/' && url !== '/menu.js' ? `/sues_virtual_life${url}` : url, eachURL: (url) => {
if (url[0] === '/' && url !== '/menu.js') {
return `/sues_virtual_life${url}`
} else {
return url
}
},
}), }),
])) ]))
.pipe(rename(path => { .pipe(rename(path => {
@ -23,4 +29,5 @@ exports.default = function () {
browserSync.init(require('../bs-config')) browserSync.init(require('../bs-config'))
watch(htmlFiles, {ignoreInitial: false}, html) watch(htmlFiles, {ignoreInitial: false}, html)
watch('sues_virtual_life.css').on('change', browserSync.reload)
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 1,006 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

View file

@ -0,0 +1,126 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- from source -->
<title>Sue's Virtual Life</title>
<link rel="shortcut icon" href="img/bs-icon.ico">
<!-- -->
<link rel="stylesheet" href="/sues_virtual_life/sues_virtual_life.css">
<!-- archive menu -->
<script src="/menu.js" type="module"></script>
</head>
<body>
<!----------------------------------------------------------------- header ---->
<header>
<img src="/sues_virtual_life/img/ban.gif">
</header>
<!------------------------------------------------------------------- main ---->
<main>
<img src="/sues_virtual_life/img/homepic.gif" alt="Left to Right: Wally, Thankies, Spike & Beanie">
<p>This site contains downloads of my own creation<br>
for the virtual life games Petz and Babyz<br>
Always refresh each page!</p>
<img src="/sues_virtual_life/img/divide.gif">
<p><u>06.24.15: Special Bulletin:</u><br>
Hopefully re-opening in Fall 2015!</p>
<img src="/sues_virtual_life/img/divide.gif">
<p><u>Installation</u></p>
<p><u>Petz</u><br>
.dog + .cat files p3+4: c:/program files/pf magic/petz/resource/dog-cat<br>
same p5: c/program files/ubi soft/studio mythos/petz 5/resource/dog-cat<br>
.pet files: same/same/same/adopted petz<br>
.clo files: same/same/same/resource/clothes</p>
<p><u>Babyz</u><br>
.baby files c/program files/mindscape/babyz/adopted babyz<br>
.clo files same/same/same/resource/clothes</p>
<img src="/sues_virtual_life/img/divide.gif">
<p><u>Disclaimer</u></p>
<p>This is a fan site only. The items on this web site all work in my
games.<br>
I am not responsible for problems you may have with your own games.<br>
You download and use these items at your own risk.</p>
<img src="/sues_virtual_life/img/divide.gif">
<p><u>Contact</u></p>
<img src="/sues_virtual_life/img/bs-avatar-a.gif">
<p>sue at boardwalkerz dot com<br>
(Replace at with @ and dot with .)<br>
Please contact about site issues only. Thanks. ;-)</p>
<img src="/sues_virtual_life/img/divide.gif">
<br>
<img src="/sues_virtual_life/img/beagle.gif" alt="Good dog, Dixie!">
</main>
<!-------------------------------------------------------------------- nav ---->
<nav>
<div class="menu">
<div class="menu-title">Information</div>
<a href="/sues_virtual_life/" class="menu-item">Home Page</a>
<a href="/sues_virtual_life/past/" class="menu-item">Past Updates</a>
<a href="/sues_virtual_life/links/" class="menu-item">Related Links</a>
</div>
<div class="menu">
<div class="menu-title">Downloads</div>
<a href="/sues_virtual_life/catz/" class="menu-item">Catz Unibreedz</a>
<a href="/sues_virtual_life/dogz/" class="menu-item">Dogz Unibreedz</a>
<a href="/sues_virtual_life/other/" class="menu-item">Other Unibreedz</a>
<a href="/sues_virtual_life/babyz/" class="menu-item">Babyz Adoption</a>
<a href="/sues_virtual_life/archive/" class="menu-item">PB Archive</a>
</div>
<div class="sidebar-text">
<div class="sidebar-text-title">Newest Download:</div>
Nothing new now.<br>
Check past updates for recent additions.
</div>
</nav>
<!---------------------------------------------------------------- sidebar ---->
<aside>
<div class="sidebar-text">
<div class="sidebar-text-title">Updates:</div>
Date: 03.23.15<br>
SVL Closed until further notice
</div>
<div class="sidebar-text">
<div class="sidebar-text-title">Related News:</div>
03.23.15: I changed the layout to an old spring css fluid.
</div>
<div class="sidebar-text">
<div class="sidebar-text-title">Layout Info:</div>
Best View: IE9, Safari 5.1.2<br>
CSS Fluid Layout
</div>
</aside>
<!----------------------------------------------------------------- footer ---->
<div class="spacer"></div>
<footer>
Boardwalkerz © 2004-2015. All rights reserved.
</footer>
</body>
</html>

View file

@ -1,27 +1,151 @@
/**
* TABLE OF CONTENTS
*
* layout ................. site layout
* text ................... global text styles
* menu ................... left sidebar nav menu
* sidebar-text ........... text sections on sidebars
*/
/* -------------------------------------------------------------------------- *\
&layout
\* -------------------------------------------------------------------------- */
body { body {
--color: #000; --background-color: #fff;
--background-color: #fff;
font-family: Tahoma, sans-serif; display: grid;
color: var(--color); grid-template:
font-weight: 100; 'header header header' 90px
font-size: 10pt; 'nav main aside' auto
'spacer spacer spacer' 10px
'footer footer footer' auto /
230px auto 200px;
} }
a, a:visited, a:active { body > * {
color: #fff; padding: 0 10px 10px;
text-decoration: none;
}
a:hover {
color: #fff;
text-decoration: underline overline;
cursor: crosshair;
} }
header { header {
height: 90px; grid-area: header;
background-color: #7ac5cd; background-color: #7ac5cd;
padding: 0 10px 10px; text-align: center;
text-align: center; }
main {
grid-area: main;
background-color: #ffd700;
text-align: center;
padding-bottom: 0;
}
nav {
grid-area: nav;
background-color: #cd8c95;
}
aside {
grid-area: aside;
background-color: #cd8c95;
}
.spacer {
grid-area: spacer;
background-color: #cd8c95;
}
footer {
grid-area: footer;
background-color: #66cd00;
color: #fff;
text-align: center;
padding: 4px 0;
}
/* -------------------------------------------------------------------------- *\
&text
\* -------------------------------------------------------------------------- */
body {
--color: #000;
font-family: Tahoma, sans-serif;
color: var(--color);
font-weight: 100;
font-size: 10pt;
}
a, a:visited, a:active {
text-decoration: none;
}
a:hover {
text-decoration: underline overline;
cursor: crosshair;
}
/* -------------------------------------------------------------------------- *\
&menu
\* -------------------------------------------------------------------------- */
.menu {
margin-top: 47px;
width: 190px;
}
.menu + .menu {
margin-top: 13px;
}
.menu-title {
font: bold 13px Verdana;
color: white;
background: #8b5f65 url(img/a-link.gif) no-repeat 8px 6px;
text-transform: uppercase;
padding: 7px 0 7px 31px;
}
.menu-item {
margin-bottom: 2px;
font-size: 13px;
background-color: #ffb6c1;
display: block;
padding: 5px 0 5px 8px;
line-height: 17px;
text-decoration: none;
color: #000;
}
.menu-item:visited, .menu-item:active {
color: #000;
}
.menu-item:hover {
text-decoration: none;
color: #fff;
background-color: #ffd700;
}
/* -------------------------------------------------------------------------- *\
&sidebar-text
\* -------------------------------------------------------------------------- */
.sidebar-text {
margin-top: 34px;
}
.sidebar-text + .sidebar-text {
margin-top: 17px;
}
.sidebar-text-title::before {
content: url(img/a-link.gif);
}
.sidebar-text-title {
text-decoration: underline;
} }

View file

@ -1,22 +1,127 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- from source --> <!-- from source -->
<title>Sue's Virtual Life</title> <title>Sue's Virtual Life</title>
<link rel="shortcut icon" href="img/bs-icon.ico"> <link rel="shortcut icon" href="img/bs-icon.ico">
<!-- --> <!-- -->
<link rel="stylesheet" href="/sues_virtual_life.css"> <link rel="stylesheet" href="/sues_virtual_life.css">
<!-- archive menu --> <!-- archive menu -->
<script src="/menu.js" type="module"></script> <script src="/menu.js" type="module"></script>
</head> </head>
<body> <body>
<!----------------------------------------------------------------- header ---->
<header> <header>
<img src="/img/ban.gif">
</header> </header>
<!------------------------------------------------------------------- main ---->
<main>
<img src="/img/homepic.gif"
alt="Left to Right: Wally, Thankies, Spike & Beanie">
<p>This site contains downloads of my own creation<br>
for the virtual life games Petz and Babyz<br>
Always refresh each page!</p>
<img src="/img/divide.gif">
<p><u>06.24.15: Special Bulletin:</u><br>
Hopefully re-opening in Fall 2015!</p>
<img src="/img/divide.gif">
<p><u>Installation</u></p>
<p><u>Petz</u><br>
.dog + .cat files p3+4: c:/program files/pf magic/petz/resource/dog-cat<br>
same p5: c/program files/ubi soft/studio mythos/petz 5/resource/dog-cat<br>
.pet files: same/same/same/adopted petz<br>
.clo files: same/same/same/resource/clothes</p>
<p><u>Babyz</u><br>
.baby files c/program files/mindscape/babyz/adopted babyz<br>
.clo files same/same/same/resource/clothes</p>
<img src="/img/divide.gif">
<p><u>Disclaimer</u></p>
<p>This is a fan site only. The items on this web site all work in my
games.<br>
I am not responsible for problems you may have with your own games.<br>
You download and use these items at your own risk.</p>
<img src="/img/divide.gif">
<p><u>Contact</u></p>
<img src="/img/bs-avatar-a.gif">
<p>sue at boardwalkerz dot com<br>
(Replace at with @ and dot with .)<br>
Please contact about site issues only. Thanks. ;-)</p>
<img src="/img/divide.gif">
<br>
<img src="/img/beagle.gif" alt="Good dog, Dixie!">
</main>
<!-------------------------------------------------------------------- nav ---->
<nav>
<div class="menu">
<div class="menu-title">Information</div>
<a href="/" class="menu-item">Home Page</a>
<a href="/past/" class="menu-item">Past Updates</a>
<a href="/links/" class="menu-item">Related Links</a>
</div>
<div class="menu">
<div class="menu-title">Downloads</div>
<a href="/catz/" class="menu-item">Catz Unibreedz</a>
<a href="/dogz/" class="menu-item">Dogz Unibreedz</a>
<a href="/other/" class="menu-item">Other Unibreedz</a>
<a href="/babyz/" class="menu-item">Babyz Adoption</a>
<a href="/archive/" class="menu-item">PB Archive</a>
</div>
<div class="sidebar-text">
<div class="sidebar-text-title">Newest Download:</div>
Nothing new now.<br>
Check past updates for recent additions.
</div>
</nav>
<!---------------------------------------------------------------- sidebar ---->
<aside>
<div class="sidebar-text">
<div class="sidebar-text-title">Updates:</div>
Date: 03.23.15<br>
SVL Closed until further notice
</div>
<div class="sidebar-text">
<div class="sidebar-text-title">Related News:</div>
03.23.15: I changed the layout to an old spring css fluid.
</div>
<div class="sidebar-text">
<div class="sidebar-text-title">Layout Info:</div>
Best View: IE9, Safari 5.1.2<br>
CSS Fluid Layout
</div>
</aside>
<!----------------------------------------------------------------- footer ---->
<div class="spacer"></div>
<footer>
Boardwalkerz © 2004-2015. All rights reserved.
</footer>
</body> </body>
</html> </html>