From 529a8386a8422d43a21e08b5992a44a4cb6690df Mon Sep 17 00:00:00 2001
From: Konstantin Varik <k@varik.ru>
Date: Tue, 17 Feb 2015 13:42:59 +0700
Subject: [PATCH] Create pace-theme-fullscreen-dark-indicator.tmpl.css

---
 ...e-theme-fullscreen-dark-indicator.tmpl.css | 75 +++++++++++++++++++
 1 file changed, 75 insertions(+)
 create mode 100644 templates/pace-theme-fullscreen-dark-indicator.tmpl.css

diff --git a/templates/pace-theme-fullscreen-dark-indicator.tmpl.css b/templates/pace-theme-fullscreen-dark-indicator.tmpl.css
new file mode 100644
index 00000000..f968aedf
--- /dev/null
+++ b/templates/pace-theme-fullscreen-dark-indicator.tmpl.css
@@ -0,0 +1,75 @@
+.pace {
+  -webkit-pointer-events: none;
+  pointer-events: none;
+
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+  -webkit-transition: -webkit-opacity 0.5s;
+  transition: opacity 0.5s;
+  opacity: 0;
+}
+
+.pace .pace-activity {
+  display: block;
+  position: fixed;
+  z-index: 2000;
+  top: 0;
+  right: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0,0,0,0.8);
+  -webkit-transition: -webkit-opacity 0.5s;
+  transition: opacity 0.5s;
+  pointer-events: none;
+}
+
+.pace.pace-active  {
+  opacity: 1;
+  -webkit-transition: -webkit-opacity 0.5s;
+  transition: opacity 0.5s;
+}
+
+.pace .pace-activity::before,
+.pace .pace-activity::after {
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    display: block;
+    border: 5px solid #fff;
+    border-radius: 50%;
+    content: '';
+}
+
+.pace .pace-activity::before {
+    margin-top: -40px;
+    margin-left: -40px;
+    width: 80px;
+    height: 80px;
+    border-right-color: rgba(0, 0, 0, .2);
+    border-left-color: rgba(0, 0, 0, .2);
+    -webkit-animation: pace-theme-corner-indicator-spin 3s linear infinite;
+    animation: pace-theme-corner-indicator-spin 3s linear infinite;
+}
+
+.pace .pace-activity::after {
+    margin-top: -20px;
+    margin-left: -20px;
+    width: 40px;
+    height: 40px;
+    border-top-color: rgba(0, 0, 0, .2);
+    border-bottom-color: rgba(0, 0, 0, .2);
+    -webkit-animation: pace-theme-corner-indicator-spin 1s linear infinite;
+    animation: pace-theme-corner-indicator-spin 1s linear infinite;
+}
+
+@-webkit-keyframes pace-theme-corner-indicator-spin {
+  0% { -webkit-transform: rotate(0deg); }
+  100% { -webkit-transform: rotate(359deg); }
+}
+@keyframes pace-theme-corner-indicator-spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(359deg); }
+}