added working indicator
[Biblio-RFID.git] / examples / selfcheck.html
index d55cbf7..efe2cff 100644 (file)
@@ -8,7 +8,7 @@
 
 body, input {
        font-family: 'Roboto', sans-serif;
-       font-size: 110%;
+       font-size: 100%;
        /* disable selection which brings havoc on touchscreens */
        -webkit-user-select: none;
        -moz-user-select: -moz-none;
@@ -51,7 +51,7 @@ input[type=button] {
        display: block;
        float: left;
        width: 100%;
-       height: 3em;
+       height: 6em;
 }
 
 .button {
@@ -71,13 +71,22 @@ input[type=button] {
        margin-left: -8em; /* width + 2 * padding / 2 */
        margin-top: -2.5em;
        width: 12em;
-       height: 5em;
+       height: 8em;
        background: #ff8;
        padding: 2em;
        border: 0.5em solid #f00;
        text-align: center;
 }
 
+#working {
+       display: none;
+       position: absolute;
+       top: 50%;
+       left: 50%;
+       margin-left: -250px; /* 500 / 2 */
+       margin-top: -187px;  /* 375 / 2 */
+}
+
 </style>
 <script type="text/javascript" src="/examples/selfcheck.js"></script>
 </head>
@@ -98,6 +107,11 @@ Timeout in <span id="tick">99</span> seconds.
 </div>
 
 
+<div id="working">
+<img src="/examples/giphy.gif">
+</div>
+
+
 <div class="page" id="start">
 
 <!--
@@ -112,7 +126,7 @@ Ako želite posuditi knjigu, najprije stavite iskaznicu na za to previđeno mjes
 Select checkin button to return books.
 -->
 
-Ako želite vratiti knjigu, pristisnite ovaj gumb.
+Ako želite vratiti knjigu, pristisnite gumb za povrat.
 
 <div class="button">
 <input name=checkin type=button value="Povrat" onClick="change_page('checkin')">