1 files changed, 98 insertions, 0 deletions
diff --git a/app/assets/stylesheets/generic/zen.scss b/app/assets/stylesheets/generic/zen.scss
new file mode 100644
index 00000000000..26afc21a6ab
--- /dev/null
+++ b/app/assets/stylesheets/generic/zen.scss
@@ -0,0 +1,98 @@
+.zennable {
+  position: relative;
+
+  input {
+    display: none;
+  }
+
+  .zen-enter-link {
+    color: #888;
+    position: absolute;
+    top: -26px;
+    right: 4px;
+  }
+
+  .zen-leave-link {
+    display: none;
+    color: #888;
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    padding: 5px;
+    font-size: 36px;
+
+    &:hover {
+      color: #111;
+    }
+  }
+
+  input:checked ~ .zen-backdrop .zen-enter-link {
+    display: none;
+  }
+
+  input:checked ~ .zen-backdrop .zen-leave-link {
+    display: block;
+    position: absolute;
+    top: 0;
+  }
+
+  input:checked ~ .zen-backdrop {
+    background-color: white;
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    z-index: 1031;
+
+    textarea {
+      border: none;
+      box-shadow: none;
+      border-radius: 0;
+      color: #000;
+      font-size: 20px;
+      line-height: 26px;
+      padding: 30px;
+      display: block;
+      outline: none;
+      resize: none;
+      height: 100vh;
+      max-width: 900px;
+      margin: 0 auto;
+    }
+  }
+
+  .zen-backdrop textarea::-webkit-input-placeholder {
+    color: white;
+  }
+
+  .zen-backdrop textarea:-moz-placeholder {
+    color: white;
+  }
+
+  .zen-backdrop textarea::-moz-placeholder {
+    color: white;
+  }
+
+  .zen-backdrop textarea:-ms-input-placeholder {
+    color: white;
+  }
+
+  input:checked ~ .zen-backdrop textarea::-webkit-input-placeholder {
+    color: #999;
+  }
+
+  input:checked ~ .zen-backdrop textarea:-moz-placeholder {
+    color: #999;
+    opacity: 1;
+  }
+
+  input:checked ~ .zen-backdrop textarea::-moz-placeholder {
+    color: #999;
+    opacity: 1;
+  }
+
+  input:checked ~ .zen-backdrop textarea:-ms-input-placeholder {
+    color: #999;
+  }
+}