mirror of
https://codeberg.org/kbruen/kai.infotren.git
synced 2025-02-22 17:19:37 +02:00
Embed header in window controls overlay
This commit is contained in:
parent
b488d28ff9
commit
b5ed00a9f1
11 changed files with 65 additions and 10 deletions
|
@ -21,6 +21,7 @@
|
|||
<h1>About</h1>
|
||||
<div class="right"></div>
|
||||
</header>
|
||||
<div class="header-placeholder"></div>
|
||||
|
||||
<div class="content">
|
||||
<h2>InfoTren</h2>
|
||||
|
|
38
base.css
38
base.css
|
@ -72,10 +72,41 @@ footer .rsk {
|
|||
}
|
||||
|
||||
header {
|
||||
position: fixed;
|
||||
left: env(titlebar-area-x, 0);
|
||||
top: env(titlebar-area-y, 0);
|
||||
width: env(titlebar-area-width, 100%);
|
||||
height: env(titlebar-area-height, 36px);
|
||||
-webkit-app-region: drag;
|
||||
app-region: drag;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.header-placeholder {
|
||||
margin-top: env(titlebar-area-height, 36px);
|
||||
}
|
||||
|
||||
header.embedded {
|
||||
background-color: #0000ff;
|
||||
color: white;
|
||||
}
|
||||
|
||||
@media (display-mode: window-controls-overlay) {
|
||||
header {
|
||||
background-color: #0000ff;
|
||||
color: white;
|
||||
}
|
||||
|
||||
header .back {
|
||||
-webkit-app-region: no-drag;
|
||||
app-region: no-drag;
|
||||
|
||||
filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(83deg) brightness(104%) contrast(101%);
|
||||
}
|
||||
}
|
||||
|
||||
header .left, header .right {
|
||||
flex-grow: 1;
|
||||
flex-basis: 0;
|
||||
|
@ -87,6 +118,13 @@ header .back {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
header.embedded .back {
|
||||
-webkit-app-region: no-drag;
|
||||
app-region: no-drag;
|
||||
|
||||
filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(83deg) brightness(104%) contrast(101%);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 17px;
|
||||
font-weight: 400;
|
||||
|
|
|
@ -16,7 +16,12 @@
|
|||
<script src="index.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>InfoTren</h1>
|
||||
<header>
|
||||
<div class="left"></div>
|
||||
<h1>InfoTren</h1>
|
||||
<div class="right"></div>
|
||||
</header>
|
||||
<div class="header-placeholder"></div>
|
||||
|
||||
<div class="content">
|
||||
<ul>
|
||||
|
|
|
@ -7,6 +7,7 @@
|
|||
"background_color": "#ffffff",
|
||||
"display": "standalone",
|
||||
"display_override": [
|
||||
"window-controls-overlay",
|
||||
"standalone",
|
||||
"minimal-ui"
|
||||
],
|
||||
|
|
|
@ -20,11 +20,12 @@
|
|||
<body>
|
||||
<header>
|
||||
<div class="left">
|
||||
<img id="back-button" class="back" src="/common/back.svg"></img>
|
||||
<img id="back-button" class="back" src="/common/back.svg" alt="Back">
|
||||
</div>
|
||||
<h1>Find Route</h1>
|
||||
<div class="right"></div>
|
||||
</header>
|
||||
<div class="header-placeholder"></div>
|
||||
|
||||
<!-- <h4><label for="stationName">Station Name</label></h4>-->
|
||||
<!-- <input type="search" class="items" name="stationName" id="stationName">-->
|
||||
|
|
|
@ -14,11 +14,12 @@
|
|||
<body>
|
||||
<header>
|
||||
<div class="left">
|
||||
<img id="back-button" class="back" src="/common/back.svg"></img>
|
||||
<img id="back-button" class="back" src="/common/back.svg" alt="Back">
|
||||
</div>
|
||||
<h1>Showcase</h1>
|
||||
<div class="right"></div>
|
||||
</header>
|
||||
<div class="header-placeholder"></div>
|
||||
|
||||
<div class="content">
|
||||
<h1>h1</h1>
|
||||
|
|
|
@ -18,11 +18,12 @@
|
|||
<body>
|
||||
<header>
|
||||
<div class="left">
|
||||
<img id="back-button" class="back" src="/common/back.svg"></img>
|
||||
<img id="back-button" class="back" src="/common/back.svg" alt="Back">
|
||||
</div>
|
||||
<h1>Station Information</h1>
|
||||
<div class="right"></div>
|
||||
</header>
|
||||
<div class="header-placeholder"></div>
|
||||
|
||||
<h4><label for="stationName">Station Name</label></h4>
|
||||
<input type="search" class="items" name="stationName" id="stationName">
|
||||
|
|
8
sw.js
8
sw.js
|
@ -1,4 +1,4 @@
|
|||
const VERSION = 'v28'
|
||||
const VERSION = 'v29'
|
||||
const API_ORIGIN = 'https://scraper.infotren.dcdev.ro/'
|
||||
const API_TRAINS = `${API_ORIGIN}v3/trains`
|
||||
const API_STATIONS = `${API_ORIGIN}v3/stations`
|
||||
|
@ -49,7 +49,7 @@ const CACHE_FIRST = [
|
|||
// API
|
||||
API_TRAINS,
|
||||
API_STATIONS,
|
||||
API_ITINERARIES,
|
||||
// API_ITINERARIES,
|
||||
];
|
||||
|
||||
/**
|
||||
|
@ -61,7 +61,9 @@ function shouldReturnFromCacheFirst(url) {
|
|||
}
|
||||
|
||||
self.addEventListener('install', (event) => {
|
||||
self.skipInstall()
|
||||
if ('skipInstall' in self) {
|
||||
self.skipInstall()
|
||||
}
|
||||
event.waitUntil(
|
||||
caches
|
||||
.open(VERSION)
|
||||
|
|
|
@ -19,11 +19,12 @@
|
|||
<body>
|
||||
<header>
|
||||
<div class="left">
|
||||
<img id="back-button" class="back" src="/common/back.svg"></img>
|
||||
<img id="back-button" class="back" src="/common/back.svg" alt="Back">
|
||||
</div>
|
||||
<h1>Train Information</h1>
|
||||
<div class="right"></div>
|
||||
</header>
|
||||
<div class="header-placeholder"></div>
|
||||
|
||||
<h4><label for="trainNumber">Train Number</label></h4>
|
||||
<input class="items" type="tel" name="trainNumber" id="trainNumber">
|
||||
|
|
|
@ -21,11 +21,13 @@
|
|||
<body>
|
||||
<header>
|
||||
<div class="left">
|
||||
<img id="back-button" class="back" src="/common/back.svg"></img>
|
||||
<img id="back-button" class="back" src="/common/back.svg" alt="Back">
|
||||
</div>
|
||||
<h1 id="title">View Station</h1>
|
||||
<div class="right"></div>
|
||||
</header>
|
||||
<div class="header-placeholder"></div>
|
||||
|
||||
<div id="-date" class="hidden">
|
||||
<p></p>
|
||||
<p class="sec" id="date"></p>
|
||||
|
|
|
@ -20,11 +20,13 @@
|
|||
<body>
|
||||
<header>
|
||||
<div class="left">
|
||||
<img id="back-button" class="back" src="/common/back.svg"></img>
|
||||
<img id="back-button" class="back" src="/common/back.svg" alt="Back">
|
||||
</div>
|
||||
<h1 id="title"></h1>
|
||||
<div class="right"></div>
|
||||
</header>
|
||||
<div class="header-placeholder"></div>
|
||||
|
||||
<div id="comp-date">
|
||||
<p class="sec" id="company"></p>
|
||||
<p class="sec" id="date"></p>
|
||||
|
|
Loading…
Add table
Reference in a new issue