FazBrowse GitHub Viewer | Trending |
URL:
| Home
Tools: [Download Repo ZIP]   [Original HTTPS Page]

Removed scrollbar introduced in commit #34, added favicon to screen a… · kriddles/barcodebuddy@5b232c3 · GitHub

  1. kriddles
  2. barcodebuddy

Repository navigation

Commit 5b232c3

Browse files
Forceu
committed
Removed scrollbar introduced in commit Forceu#34, added favicon to screen as well
1 parent 0138082 commit 5b232c3

1 file changed

Lines changed: 141 additions & 93 deletions

File tree

‎screen.php‎

Lines changed: 141 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -25,101 +25,149 @@
2525
<!DOCTYPE html>
2626
<html>
2727
<head>
28+
29+
30+
<link rel="apple-touch-icon" sizes="57x57" href="./incl/img/favicon/apple-icon-57x57.png">
31+
<link rel="apple-touch-icon" sizes="60x60" href="./incl/img/favicon/apple-icon-60x60.png">
32+
<link rel="apple-touch-icon" sizes="72x72" href="./incl/img/favicon/apple-icon-72x72.png">
33+
<link rel="apple-touch-icon" sizes="76x76" href="./incl/img/favicon/apple-icon-76x76.png">
34+
<link rel="apple-touch-icon" sizes="114x114" href="./incl/img/favicon/apple-icon-114x114.png">
35+
<link rel="apple-touch-icon" sizes="120x120" href="./incl/img/favicon/apple-icon-120x120.png">
36+
<link rel="apple-touch-icon" sizes="144x144" href="./incl/img/favicon/apple-icon-144x144.png">
37+
<link rel="apple-touch-icon" sizes="152x152" href="./incl/img/favicon/apple-icon-152x152.png">
38+
<link rel="apple-touch-icon" sizes="180x180" href="./incl/img/favicon/apple-icon-180x180.png">
39+
<link rel="icon" type="image/png" sizes="192x192" href="./incl/img/favicon/android-icon-192x192.png">
40+
<link rel="icon" type="image/png" sizes="32x32" href="./incl/img/favicon/favicon-32x32.png">
41+
<link rel="icon" type="image/png" sizes="96x96" href="./incl/img/favicon/favicon-96x96.png">
42+
<link rel="icon" type="image/png" sizes="16x16" href="./incl/img/favicon/favicon-16x16.png">
43+
<meta name="msapplication-TileImage" content="./incl/img/favicon/ms-icon-144x144.png">
44+
<meta name="msapplication-navbutton-color" content="#ccc">
45+
<meta name="msapplication-TileColor" content="#ccc">
46+
<meta name="apple-mobile-web-app-status-bar-style" content="#ccc">
47+
<meta name="theme-color" content="#ccc">
48+
49+
2850
<title>Barcode Buddy Screen</title>
2951
<style>
30-
body, html{
31-
padding:0;
32-
margin:0;
33-
position:relative;
34-
height:100%
35-
}
36-
.header {
37-
width:100%;
38-
background:#ccc;
39-
padding:10px;
40-
box-sizing:border-box;
41-
text-transform: lowercase;
42-
}
43-
.content{
44-
background:#eee;
45-
width:100%;
46-
padding:10px;
47-
height:100%;
48-
box-sizing:border-box;
49-
padding:10px;
50-
text-align: center;
51-
align-content: center
52-
}
53-
.hdr-left {
54-
text-align: center;
55-
padding-left: 10px;
56-
}
57-
.hdr-right {
58-
float: right;
59-
width: 30%;
60-
text-align: right;
61-
padding-right: 10px
62-
}
52+
body,
53+
html {
54+
padding: 0;
55+
margin: 0;
56+
position: relative;
57+
height: 100%
58+
}
59+
60+
61+
.main-container {
62+
height:100%;
63+
display:flex;
64+
display: -webkit-flex;
65+
flex-direction: column;
66+
-webkit-flex-direction: column;
67+
-webkit-align-content: stretch;
68+
align-content: stretch;
69+
}
70+
71+
.header {
72+
width: 100%;
73+
background: #ccc;
74+
padding: 10px;
75+
box-sizing: border-box;
76+
text-transform: lowercase;
77+
flex: 0 1 auto;
78+
}
79+
80+
.content {
81+
background: #eee;
82+
width: 100%;
83+
padding: 10px;
84+
flex: 1 0 auto;
85+
box-sizing: border-box;
86+
padding: 10px;
87+
text-align: center;
88+
align-content: center
89+
}
90+
91+
.hdr-left {
92+
text-align: center;
93+
padding-left: 10px;
94+
}
95+
96+
.hdr-right {
97+
float: right;
98+
width: 30%;
99+
text-align: right;
100+
padding-right: 10px
101+
}
102+
103+
#soundbuttondiv {
104+
position: fixed;
105+
bottom: 10px;
106+
right: 10px;
107+
}
108+
109+
.h1 {
110+
font: bold 4em arial;
111+
margin: auto;
112+
text-align: center;
113+
}
114+
115+
.h2 {
116+
font: bold 3em arial;
117+
margin: auto;
118+
padding: 10px;
119+
text-align: center;
120+
}
121+
122+
.h3 {
123+
font: bold 2em arial;
124+
margin: auto;
125+
padding: 10px;
126+
text-align: center;
127+
}
128+
129+
.h4 {
130+
font: bold 1.5em arial;
131+
margin: auto;
132+
padding: 6px;
133+
}
134+
135+
.h5 {
136+
font: bold 1em arial;
137+
margin: auto;
138+
text-align: center;
139+
}
63140

64-
#soundbuttondiv {
65-
position: fixed;
66-
bottom: 10px;
67-
right: 10px;
68-
}
69-
.h1 {
70-
font: bold 50pt arial;
71-
margin: auto;
72-
text-align: center;
73-
}
74-
.h2 {
75-
font: bold 40pt arial;
76-
margin: auto;
77-
padding: 10px;
78-
text-align: center;
79-
}
80-
.h3 {
81-
font: bold 30pt arial;
82-
margin: auto;
83-
padding: 10px;
84-
text-align: center;
85-
}
86-
.h4 {
87-
font: bold 15pt arial;
88-
margin: auto;
89-
padding: 6px;
90-
}
91-
.h5 {
92-
font: bold 10pt arial;
93-
margin: auto;
94-
text-align: center;
95-
}
96-
.sound {
97-
background-color : #31B0D5;
98-
color: white;
99-
padding: 1em 2em;
100-
border-radius: 4px;
101-
border-color: #46b8da;
102-
}
103-
#muteimg {
104-
height: 2em;
105-
width: 2em;
106-
}
107-
@media only screen and (orientation: portrait) and not (display-mode: fullscreen) {
108141
.sound {
109-
padding: 2em 4em;
110-
}
111-
#muteimg {
112-
height: 3em;
113-
width: 3em;
114-
}
115-
}
142+
background-color: #31B0D5;
143+
color: white;
144+
padding: 1em 2em;
145+
border-radius: 4px;
146+
border-color: #46b8da;
147+
}
148+
149+
#muteimg {
150+
height: 2em;
151+
width: 2em;
152+
}
153+
154+
@media only screen and (orientation: portrait) and not (display-mode: fullscreen) {
155+
.sound {
156+
padding: 2em 4em;
157+
}
158+
#muteimg {
159+
height: 3em;
160+
width: 3em;
161+
}
162+
}
116163
</style>
117164

118165
</head>
119166
<body>
120167
<script src="./incl/js/nosleep.min.js"></script>
121168
<script src="./incl/js/he.js"></script>
122169

170+
<div class="main-container">
123171
<div id="header" class="header">
124172
<span class="hdr-right h4">
125173
Grocy Status: <span id="grocy-sse">Connecting...</span><br>
@@ -137,7 +185,7 @@
137185
</div>
138186
</div>
139187
</div>
140-
188+
</div>
141189

142190
<audio id="beep_success" muted="muted" src="incl/websocket/beep.ogg" type="audio/ogg" preload="auto"></audio>
143191
<audio id="beep_nosuccess" muted="muted" src="incl/websocket/buzzer.ogg" type="audio/ogg" preload="auto"></audio>
@@ -155,17 +203,17 @@ function toggleSound() {
155203
if (!wakeLockEnabled) {
156204
noSleep.enable();
157205
wakeLockEnabled = true;
158-
document.getElementById('beep_success').muted=false;
159-
document.getElementById('beep_nosuccess').muted=false;
160-
<?php if ($BBCONFIG["WS_FULLSCREEN"]) { echo " document.documentElement.requestFullscreen();"; }?>
161-
document.getElementById("muteimg").src = "incl/img/unmute.svg";
206+
document.getElementById('beep_success').muted=false;
207+
document.getElementById('beep_nosuccess').muted=false;
208+
<?php if ($BBCONFIG["WS_FULLSCREEN"]) { echo " document.documentElement.requestFullscreen();"; }?>
209+
document.getElementById("muteimg").src = "incl/img/unmute.svg";
162210
} else {
163211
noSleep.disable();
164-
<?php if ($BBCONFIG["WS_FULLSCREEN"]) { echo " document.exitFullscreen();"; } ?>
212+
<?php if ($BBCONFIG["WS_FULLSCREEN"]) { echo " document.exitFullscreen();"; } ?>
165213
wakeLockEnabled = false;
166-
document.getElementById('beep_success').muted=true;
167-
document.getElementById('beep_nosuccess').muted=true;
168-
document.getElementById("muteimg").src = "incl/img/mute.svg";
214+
document.getElementById('beep_success').muted=true;
215+
document.getElementById('beep_nosuccess').muted=true;
216+
document.getElementById("muteimg").src = "incl/img/mute.svg";
169217
}
170218
}
171219

0 commit comments

Comments
 (0)
Back | FazBrowse Home | New Git URL