diff sat_templates/templates/bulma/static/styles.css @ 242:bb5193cef770

bulma (css): some styles to handle dynamic content + misc
author Goffi <goffi@goffi.org>
date Fri, 19 Jun 2020 17:57:13 +0200
parents f5f428a50c10
children a841837afe78
line wrap: on
line diff
--- a/sat_templates/templates/bulma/static/styles.css	Fri Jun 19 17:57:13 2020 +0200
+++ b/sat_templates/templates/bulma/static/styles.css	Fri Jun 19 17:57:13 2020 +0200
@@ -1,6 +1,7 @@
 :root {
   --photo-height: 280px;
   --photo-height--poster: 500px;
+  --col-primary: #82baff;
 }
 
 .has-whitespace-pre-wrap {
@@ -47,6 +48,12 @@
     background-color: #eee !important;
 }
 
+.x-is-hoverable-primary:hover {
+	background-color: var(--col-primary) !important;
+	border-radius: 50%;
+	box-shadow: 0px 0px 0 0.25rem var(--col-primary);
+}
+
 .is-chat-message {
     margin: 0.5rem 0 0 !important;
     padding: 0 !important;
@@ -57,26 +64,6 @@
     line-height: 0;
 }
 
-.has-margin-top-1 {
-    margin-top: 1rem;
-}
-
-.has-vmargin-1 {
-    margin: 0.5rem 0;
-}
-
-.has-padding-1 {
-    padding: 0.25rem;
-}
-
-.has-vpadding-1 {
-    padding: 0 0.25rem;
-}
-
-.has-vpadding-6 {
-    padding: 0 1.5rem;
-}
-
 .has-no-background {
 	box-shadow: none !important;
     background-color: initial !important;
@@ -100,6 +87,79 @@
     text-overflow: ellipsis;
 }
 
+.has-border-dashed {
+    border-style: dashed;
+}
+
+.has-border-grey-light {
+    border-color: hsl(0, 0%, 71%);
+}
+
+.has-justify-start {
+    justify-content: start;
+}
+
+/**************
+ * selections *
+ **************/
+
+.selected_for_deletion {
+	outline: solid red 0.25rem;
+}
+
+/***************
+ * misc states *
+ **************/
+
+.state_deleted {
+    opacity: 0;
+    transform: scale(0);
+    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
+}
+
+
+/***********
+ * dialogs *
+ **********/
+
+.modal-content {
+    transform: scaleY(0);
+}
+
+div.state_appended .modal-content {
+    transform: scaleY(1);
+    transition: transform 0.15s ease-in;
+}
+
+
+/***************
+ * progression *
+ ***************/
+
+.progress_started img {
+    filter: grayscale(100%);
+}
+
+.progress_finished img {
+    filter: grayscale(0%);
+    transition: filter 1.5s ease-out;
+}
+
+.progress_finished progress {
+    height: 0;
+    opacity: 0;
+    transition: all 1.5s ease-out;
+}
+
+.progress {
+    transition: width 5s ease;
+}
+
+
+/**********
+ * drawer *
+ **********/
+
 
 .panel-drawer {
     /* A panel which is hidden by default but can be