1 files changed, 57 insertions, 0 deletions
diff --git a/apps/system/style/attention_screen.css b/apps/system/style/attention_screen.css
new file mode 100644
index 0000000..126d52e
--- /dev/null
+++ b/apps/system/style/attention_screen.css
@@ -0,0 +1,57 @@
+#attention-screen {
+  position: absolute;
+  top: 0px;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  display: none;
+
+  transition: transform 0.5s ease;
+}
+
+#attention-screen.displayed {
+  display: block;
+}
+
+#screen.active-statusbar #attention-screen {
+  transform: translateY(calc(-100% + 40px));
+}
+
+#screen.active-statusbar #attention-screen.status-mode {
+  height: 40px;
+  transform: translateY(0px);
+  transition: none;
+}
+
+#attention-screen.status-mode > iframe {
+  margin-top: 0;
+  height: 100%;
+}
+
+#attention-screen > iframe {
+  border: 0;
+  width: 100%;
+  /* we have the 20px status bar on top */
+  height: calc(100% - 20px);
+  margin-top: 20px;
+
+  background-color: transparent;
+
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+#attention-screen > #attention-bar {
+  position: absolute;
+  bottom: 0px;
+  width: 100%;
+  /* Status bar height * 2 */
+  height: 40px;
+  z-index: 2;
+  display: none;
+}
+
+#screen.active-statusbar #attention-screen > #attention-bar {
+  display: block;
+}