kbruen
/
kai.infotren
mirror of https://codeberg.org/kbruen/kai.infotren.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Embed header in window controls overlay

master
Kenneth Bruen 2 years ago
parent
b488d28ff9
commit
b5ed00a9f1
Signed by: kbruen
GPG Key ID: C1980A470C3EE5B1
11 changed files with 65 additions and 10 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      about.html
  2. 38
      base.css
  3. 5
      index.html
  4. 1
      manifest.json
  5. 3
      route.html
  6. 3
      showcase.html
  7. 3
      station.html
  8. 6
      sw.js
  9. 3
      train.html
  10. 4
      view-station.html
  11. 4
      view-train.html

1
about.html
Unescape View File

@ -21,6 +21,7 @@
<h1>About</h1> <h1>About</h1>
<div class="right"></div> <div class="right"></div>
</header> </header>
<div class="header-placeholder"></div>
<div class="content"> <div class="content">
<h2>InfoTren</h2> <h2>InfoTren</h2>

38
base.css
Unescape View File

@ -72,10 +72,41 @@ footer .rsk {
} }
header { 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; display: flex;
align-items: center; 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 { header .left, header .right {
flex-grow: 1; flex-grow: 1;
flex-basis: 0; flex-basis: 0;
@ -87,6 +118,13 @@ header .back {
cursor: pointer; 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 { h1 {
font-size: 17px; font-size: 17px;
font-weight: 400; font-weight: 400;

5
index.html
Unescape View File

@ -16,7 +16,12 @@
<script src="index.js"></script> <script src="index.js"></script>
</head> </head>
<body> <body>
<header>
<div class="left"></div>
<h1>InfoTren</h1> <h1>InfoTren</h1>
<div class="right"></div>
</header>
<div class="header-placeholder"></div>
<div class="content"> <div class="content">
<ul> <ul>

1
manifest.json
Unescape View File

@ -7,6 +7,7 @@
"background_color": "#ffffff", "background_color": "#ffffff",
"display": "standalone", "display": "standalone",
"display_override": [ "display_override": [
"window-controls-overlay",
"standalone", "standalone",
"minimal-ui" "minimal-ui"
], ],

3
route.html
Unescape View File

@ -20,11 +20,12 @@
<body> <body>
<header> <header>
<div class="left"> <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> </div>
<h1>Find Route</h1> <h1>Find Route</h1>
<div class="right"></div> <div class="right"></div>
</header> </header>
<div class="header-placeholder"></div>
<!-- <h4><label for="stationName">Station Name</label></h4>--> <!-- <h4><label for="stationName">Station Name</label></h4>-->
<!-- <input type="search" class="items" name="stationName" id="stationName">--> <!-- <input type="search" class="items" name="stationName" id="stationName">-->

3
showcase.html
Unescape View File

@ -14,11 +14,12 @@
<body> <body>
<header> <header>
<div class="left"> <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> </div>
<h1>Showcase</h1> <h1>Showcase</h1>
<div class="right"></div> <div class="right"></div>
</header> </header>
<div class="header-placeholder"></div>
<div class="content"> <div class="content">
<h1>h1</h1> <h1>h1</h1>

3
station.html
Unescape View File

@ -18,11 +18,12 @@
<body> <body>
<header> <header>
<div class="left"> <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> </div>
<h1>Station Information</h1> <h1>Station Information</h1>
<div class="right"></div> <div class="right"></div>
</header> </header>
<div class="header-placeholder"></div>
<h4><label for="stationName">Station Name</label></h4> <h4><label for="stationName">Station Name</label></h4>
<input type="search" class="items" name="stationName" id="stationName"> <input type="search" class="items" name="stationName" id="stationName">

6
sw.js
Unescape View File

@ -1,4 +1,4 @@
const VERSION = 'v28' const VERSION = 'v29'
const API_ORIGIN = 'https://scraper.infotren.dcdev.ro/' const API_ORIGIN = 'https://scraper.infotren.dcdev.ro/'
const API_TRAINS = `${API_ORIGIN}v3/trains` const API_TRAINS = `${API_ORIGIN}v3/trains`
const API_STATIONS = `${API_ORIGIN}v3/stations` const API_STATIONS = `${API_ORIGIN}v3/stations`
@ -49,7 +49,7 @@ const CACHE_FIRST = [
// API // API
API_TRAINS, API_TRAINS,
API_STATIONS, API_STATIONS,
API_ITINERARIES, // API_ITINERARIES,
]; ];
/** /**
@ -61,7 +61,9 @@ function shouldReturnFromCacheFirst(url) {
} }
self.addEventListener('install', (event) => { self.addEventListener('install', (event) => {
if ('skipInstall' in self) {
self.skipInstall() self.skipInstall()
}
event.waitUntil( event.waitUntil(
caches caches
.open(VERSION) .open(VERSION)

3
train.html
Unescape View File

@ -19,11 +19,12 @@
<body> <body>
<header> <header>
<div class="left"> <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> </div>
<h1>Train Information</h1> <h1>Train Information</h1>
<div class="right"></div> <div class="right"></div>
</header> </header>
<div class="header-placeholder"></div>
<h4><label for="trainNumber">Train Number</label></h4> <h4><label for="trainNumber">Train Number</label></h4>
<input class="items" type="tel" name="trainNumber" id="trainNumber"> <input class="items" type="tel" name="trainNumber" id="trainNumber">

4
view-station.html
Unescape View File

@ -21,11 +21,13 @@
<body> <body>
<header> <header>
<div class="left"> <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> </div>
<h1 id="title">View Station</h1> <h1 id="title">View Station</h1>
<div class="right"></div> <div class="right"></div>
</header> </header>
<div class="header-placeholder"></div>
<div id="-date" class="hidden"> <div id="-date" class="hidden">
<p></p> <p></p>
<p class="sec" id="date"></p> <p class="sec" id="date"></p>

4
view-train.html
Unescape View File

@ -20,11 +20,13 @@
<body> <body>
<header> <header>
<div class="left"> <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> </div>
<h1 id="title"></h1> <h1 id="title"></h1>
<div class="right"></div> <div class="right"></div>
</header> </header>
<div class="header-placeholder"></div>
<div id="comp-date"> <div id="comp-date">
<p class="sec" id="company"></p> <p class="sec" id="company"></p>
<p class="sec" id="date"></p> <p class="sec" id="date"></p>

Write Preview
Loading…
Cancel
Save