initial checkin

Signed-off-by: Georg Ehrke <developer@georgehrke.com>

1 files changed, 163 insertions, 0 deletions

diff --git a/css/style.scss b/css/style.scss
new file mode 100644
index 0000000..be1a933
--- /dev/null
+++ b/css/style.scss
@@ -0,0 +1,163 @@
+/**
+ * Privacy App
+ *
+ * @author Georg Ehrke
+ * @copyright 2019 Georg Ehrke <oc.list@georgehrke.com>
+ *
+ * This library is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or any later version.
+ *
+ * This library is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public
+ * License along with this library.  If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+@include icon-black-white('control', 'privacy', 1);
+@include icon-black-white('freedom', 'privacy', 1);
+@include icon-black-white('knowledge', 'privacy', 1);
+
+.user-data-manifesto-rights {
+  padding: 15px 0;
+
+  @media screen and (min-width: 600px) {
+    display: flex;
+  }
+
+  div {
+    padding: 0 10px;
+
+    div.icon {
+      background-size: 32px;
+      min-width: 32px;
+      min-height: 32px;
+    }
+
+    h5 {
+      text-align: center;
+    }
+
+    h5:first-of-type {
+      margin-top: 10px;
+    }
+
+    p {
+      margin-top: 10px;
+    }
+  }
+}
+
+.section {
+  h4:not(:first-of-type) {
+    margin-top: 20px;
+  }
+}
+
+.where-is-my-data {
+  max-width: 500px;
+
+  > span.icon.icon-loading {
+    display: block;
+    height: 320px;
+    width: 500px;
+  }
+
+  > svg {
+    > path,
+    > g {
+      fill: #dddddd;
+      stroke: #f4f4f4;
+    }
+  }
+
+  > p {
+
+    > span.icon.icon-rename {
+      display: inline-block;
+      opacity: 0.5;
+
+      &:hover {
+        opacity: 0.8;
+      }
+    }
+  }
+
+  > div.multiselect-container {
+    position: relative;
+
+    > div.multiselect {
+      width: 100%;
+    }
+
+    > span.icon.icon-loading {
+      display: inline-block;
+      position: absolute;
+      top: 9px;
+      left: calc(50% - 23px);
+    }
+  }
+}
+
+
+.who-has-access {
+  display: flex;
+  flex-wrap: wrap;
+
+  div.avatardiv,
+  div.addAdditionalAdmin,
+  form.addAdditionalAdminFormContainer{
+    margin: 10px;
+  }
+
+  div.admin-avatar-container {
+    position: relative;
+
+    > span.icon.icon-close {
+      display: none;
+      position: absolute;
+      top: 0;
+      right: 0;
+    }
+
+    &:hover span.icon.icon-close {
+      display: inline-block;
+    }
+  }
+
+  div.addAdditionalAdmin {
+    width: 64px;
+    height: 64px;
+    line-height: 64px;
+    font-size: 35px;
+    background-color: var(--color-background-darker);
+    border-radius: 50%;
+    color: var(--color-main-text);
+    text-align: center;
+  }
+
+  form.addAdditionalAdminFormContainer {
+    margin-top: 20px;
+    position: relative;
+    grid-row: 1;
+    display: inline-flex;
+    align-items: center;
+  }
+
+  span.icon.icon-loading {
+    display: block;
+    height: 32px;
+    width: 32px;
+    margin: 26px;
+
+    &.hidden {
+      display: none;
+    }
+  }
+
+}
+