jurassic-park-interface/index.html

286 lines
12 KiB
HTML
Raw Normal View History

2020-05-26 20:19:44 +00:00
<!DOCTYPE html>
<html>
<head>
<link
rel="stylesheet"
type="text/css"
href="./public/stylesheets/styles.css"
/>
2020-05-26 20:19:44 +00:00
</head>
<body>
<div class="outer-edge__light" id="outer-container__outer">
<div class="inner-edge__light" id="outer-container__inner">
<div id="grid-container">
2020-06-08 11:51:45 +00:00
<div class="outer-edge__dark__no-right-edge" id="map-display__outer">
<div class="inner-edge__light__no-padding" id="map-display__inner">
<div class="map-display__container">
2020-06-08 11:51:45 +00:00
<div class="map-display__system-status__container">
2020-05-28 13:49:52 +00:00
<div class="map-display__system-wrapper">
2020-06-08 11:51:45 +00:00
<h1 id="sys-one" class="map-display__system-status">
2020-05-28 13:49:52 +00:00
SYSTEM SECURED
</h1>
</div>
2020-06-08 11:51:45 +00:00
<div class="map-display__center-section">
<div class="map-display__system-wrapper">
<h1 id="sys-two" class="map-display__system-status">
SYSTEM SECURED
</h1>
</div>
<div class="map-display__system-wrapper">
<h1 id="sys-three" class="map-display__system-status">
SYSTEM SECURED
</h1>
</div>
</div>
2020-05-28 13:49:52 +00:00
<div class="map-display__system-wrapper">
2020-06-08 11:51:45 +00:00
<h1 id="sys-four" class="map-display__system-status">
2020-05-28 13:49:52 +00:00
SYSTEM SECURED
</h1>
</div>
</div>
</div>
<div class="room-info__container">
<div class="room-info__level-display">
<p class="room-info__level-text">LEVEL</p>
<p class="room-info__level-number">2</p>
</div>
<div class="room-info__title-container">
<h3 class="room-info__title">Control Room / Plan View</h3>
<p class="room-info__subtitle">
drawing number - 305pcoffintunaphooter
</p>
</div>
<div class="room-info__level-display">
<p class="room-info__level-text">LEVEL</p>
<p class="room-info__level-number">2</p>
2020-05-26 20:19:44 +00:00
</div>
</div>
</div>
</div>
<div class="outer-edge__light__no-right-edge" id="console-display">
<div class="inner-edge__light">
<div class="outer-edge__dark">
<div class="inner-edge__light">
<div class="console-display__wrapper">
<div class="screen-container__wrapper">
<div class="screen-container__outer">
<p class="screen-container__text">SCREEN</p>
</div>
<div class="triangle-wrapper">
<div class="outer-triangle__right"></div>
<div class="inner-triangle__right"></div>
</div>
<div class="buffer"></div>
</div>
<div class="island-container__wrapper">
<div class="triangle-wrapper" id="island-triangle">
<div class="outer-triangle__left"></div>
<div class="inner-triangle__left"></div>
</div>
<div class="island-container__outer">
<p class="island-container__text">
Isla Nubar, Costa Rica
</p>
</div>
</div>
</div>
2020-05-26 20:19:44 +00:00
</div>
</div>
</div>
</div>
<div class="outer-edge__light" id="control-panel">
<div class="inner-edge__light" id="control-panel__inner">
<div class="control-panel__button-display">
<div class="button__depressed">
<p class="button-text__embossed small-button">VEHICLE</p>
</div>
<div class="outer-edge__light buttons">
<div class="inner-edge__light">
<p class="button-text__engraved small-button">TOUR</p>
2020-06-01 14:33:53 +00:00
</div>
</div>
<div class="outer-edge__light buttons">
<div class="inner-edge__light">
<p class="button-text__engraved small-button">POWER</p>
2020-06-01 14:33:53 +00:00
</div>
</div>
<div class="outer-edge__light buttons">
<div class="inner-edge__light">
<p class="button-text__engraved small-button">TIME</p>
</div>
</div>
</div>
<div class="control-panel__video-screen">
<div class="outer-edge__light">
<div class="inner-edge__light__no-padding">
<div class="video-screen">
<div class="video-screen_loading-spinner__wrapper">
<div class="video-screen__loading-spinner"></div>
</div>
2020-06-01 18:50:36 +00:00
<div class="video-screen__text-wrapper">
<h3 class="video-screen__header">
rebooting system...
</h3>
<p class="video-screen__info-text">
volume --- nedryland jp
</p>
2020-06-01 18:50:36 +00:00
</div>
</div>
</div>
</div>
</div>
<div class="control-panel__button-control">
<div class="button-control__top">
<div class="outer-edge__light__no-right-edge">
<div class="inner-edge__light">
2020-06-03 12:42:17 +00:00
<p class="button-text__engraved__light large-button">
hold
</p>
</div>
</div>
<div class="outer-edge__light__no-right-edge">
<div class="inner-edge__light">
2020-06-03 12:42:17 +00:00
<p class="button-text__engraved__light large-button">
quit
</p>
</div>
</div>
<div class="outer-edge__light">
<div class="inner-edge__light">
2020-06-03 12:42:17 +00:00
<p class="button-text__engraved__light large-button">
new
</p>
</div>
</div>
</div>
<div class="button-control__bottom">
<div class="outer-edge__light__no-right-edge">
<div class="inner-edge__light">
<p class="button-text__engraved__light large-button">
Next
</p>
</div>
</div>
<div class="outer-edge__light__no-right-edge">
<div class="inner-edge__light">
<p
class="button-text__engraved__light large-button"
id="rewind-button"
>
▶▶
2020-06-03 12:42:17 +00:00
</p>
</div>
</div>
<div class="outer-edge__light__no-right-edge">
<div class="inner-edge__light">
<p
class="button-text__engraved__light large-button"
id="forward-button"
>
▶▶
2020-06-03 12:42:17 +00:00
</p>
</div>
</div>
<div class="outer-edge__light__no-right-edge">
<div class="inner-edge__light">
<p
class="button-text__engraved__light large-button"
id="play-button"
>
2020-06-03 12:42:17 +00:00
</p>
</div>
</div>
<div class="outer-edge__light">
<div class="inner-edge__light">
<p
class="button-text__engraved__light large-button"
id="stop-button"
>
2020-06-03 12:42:17 +00:00
</p>
</div>
</div>
</div>
</div>
<div class="control-panel__button-display">
<div class="button__depressed">
<p class="button-text__embossed small-button">glitches</p>
</div>
<div class="outer-edge__light buttons">
<div class="inner-edge__light">
<p class="button-text__engraved small-button">maps</p>
</div>
</div>
<div class="outer-edge__light buttons">
<div class="inner-edge__light">
<p class="button-text__engraved small-button">system</p>
</div>
</div>
<div class="outer-edge__light buttons">
<div class="inner-edge__light">
<p class="button-text__engraved small-button">emerg.</p>
</div>
</div>
</div>
<div class="control-panel__output-display">
<div class="outer-edge__light">
<div class="inner-edge__light">
2020-06-04 13:47:21 +00:00
<div class="outer-edge__console">
<div class="inner-edge__console">
<div class="output-display__wrapper">
<div class="output-display-content__wrapper">
2020-06-04 16:49:02 +00:00
<p class="output-display-content__status">clear</p>
<p class="output-display-content__content">
- Ldg - Volume - JP
</p>
</div>
<div class="output-display-content__wrapper">
2020-06-04 16:49:02 +00:00
<p class="output-display-content__status">clear</p>
<p class="output-display-content__content">
- Boot Successful - CLEAR
</p>
</div>
<div class="output-display-content__wrapper">
<p class="output-display-content__status">clear</p>
<p class="output-display-content__content">
- Format Gabber - Chaires
</p>
</div>
<div class="output-display-content__wrapper">
<p class="output-display-content__status">clear</p>
<p class="output-display-content__content">
- Operator - Andres Ramierez dkhd
</p>
</div>
<div class="output-display-content__wrapper">
<p class="output-display-content__status">clear</p>
<p class="output-display-content__content">
- Vidnet - Camerea VC net01
</p>
</div>
<div class="output-display-content__wrapper">
<p class="output-display-content__status">clear</p>
<p class="output-display-content__content">
- Communications = Active
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="outer-edge__light" id="system-icons">
<div class="inner-edge__light">
<p></p>
</div>
2020-05-26 20:19:44 +00:00
</div>
</div>
</div>
</div>
</body>
2020-06-04 16:49:02 +00:00
</html>