Merge pull request #761 from noesya/pure_blocks

Amélioration de l'édition des blocs

app/assets/javascripts/admin/pure.js

@@ -6,6 +6,7 @@
 //= require simple_form_bs5_file_input
 //= require cropperjs/dist/cropper
 //= require jquery-cropper/dist/jquery-cropper
+// TODO remove appstack js
 //= require appstack/app
 //= require gdpr/cookie_consent
 //= require sortablejs/Sortable

app/assets/stylesheets/admin/appstack/style.sass

@@ -48,7 +48,8 @@ main.content
 
 h1
     margin-bottom: 30px
-
+p
+    color: black
 .sidebar-nav .fas
     min-width: 20px
 
@@ -113,4 +114,28 @@ h1
             padding-bottom: 6px
 
 .pure__separation
-    display: none
\ No newline at end of file
+    display: none
+
+// Menu item
+.kind--selected
+    *
+        color: white
+
+// Bloc datatable
+.fake-table
+    border: 1px solid $border-color
+    display: table
+    margin-bottom: 10px
+    .tr
+        border-bottom: 1px solid $border-color
+    .td
+        min-width: 120px
+        padding: 10px !important
+        &:not(:first-child)
+            border-left: 1px solid  $border-color
+    .tbody
+        .tr
+            &:nth-child(even)
+                background: $table-striped-bg
+            &:hover
+                background: $table-hover-bg
\ No newline at end of file

app/assets/stylesheets/admin/commons/batch-selectable.sass

+[data-batch-selectable]
+    [data-batch-selectable-role]
+        opacity: 0.1
+        transition: opacity 0.25s ease
+    &:hover
+        [data-batch-selectable-role]
+            opacity: 1
\ No newline at end of file

app/assets/stylesheets/admin/commons/filters.sass

+.filters
+    position: relative
+    &__button
+        min-width: 100px
+        position: absolute
+        right: 0
+        top: 0
+    &__content
+        padding-bottom: 30px
+        padding-right: 200px

app/assets/stylesheets/admin/commons/table.sass

+.table
+    th:first-of-type,
+    td:first-of-type
+        padding-left: 0
+    &--with-actions
+        td:last-of-type
+            padding-right: 0
+            text-align: right
\ No newline at end of file

app/assets/stylesheets/admin/pure.sass

@@ -13,3 +13,5 @@
 @import '../commons/*'
 @import 'commons/*'
 @import 'pure/style'
+@import 'pure/buttons'
+@import 'pure/navigation'

app/assets/stylesheets/admin/pure/buttons.sass

+.btn-xs
+    font-size: 14px
+    padding: 2px 7px
+
+.btn-light
+    background: $color-background
+    border-color: $color-border

app/assets/stylesheets/admin/pure/fonts.sass

@@ -17,11 +17,11 @@
     font-family: 'Basier Square'
     font-style: normal
     font-weight: 700
-    src: asset-url("Basier-Square/basiersquare-bold-webfont.woff2") format("woff2"), url("Basier-Square/basiersquare-bold-webfont.woff") format("woff")
+    src: asset-url("Basier-Square/basiersquare-semibold-webfont.woff2") format("woff2"), url("Basier-Square/basiersquare-semibold-webfont.woff") format("woff")
 
 @font-face
     font-display: swap
     font-family: 'Basier Square'
     font-style: italic
     font-weight: 700
-    src: asset-url("Basier-Square/basiersquare-bolditalic-webfont.woff2") format("woff2"), url("Basier-Square/basiersquare-bolditalic-webfont.woff") format("woff")
+    src: asset-url("Basier-Square/basiersquare-semibolditalic-webfont.woff2") format("woff2"), url("Basier-Square/basiersquare-semibolditalic-webfont.woff") format("woff")

app/assets/stylesheets/admin/pure/navigation.sass

+.navbar
+    left: 0
+    padding-top: $spacing2
+    position: absolute
+    right: 0
+    .bi
+        font-size: 26px
+        vertical-align: middle
+    .navbar-brand
+        img
+            width: 100px
+    .btn-open
+        margin-right: -14px
+#menu
+    background: black
+    bottom: 0
+    color: white
+    left: 0
+    overflow-y: scroll
+    padding-bottom: 30px
+    position: fixed
+    right: 0
+    top: 0
+    z-index: 1000
+    .avatar
+        width: 80px
+    .menu-content
+        margin-top: 150px
+        position: relative
+        ul
+            list-style-type: none
+            padding: 0
+            li
+                padding: 5px 0
+                span
+                    opacity: 0.2
+        a
+            color: white
+            text-decoration-color: rgba(255, 255, 255, 0.2)
+            text-decoration-line: underline
+            &:hover
+                text-decoration-color: rgba(255, 255, 255, 1)

app/assets/stylesheets/admin/pure/style.sass

@@ -15,54 +15,22 @@
         border-width: 10px
         margin-bottom: $spacing3
 
-.navbar
-    position: absolute
-    left: 0
-    right: 0
-    padding-top: $spacing2
-    .bi
-        font-size: 26px
-        vertical-align: middle
-    .navbar-brand
-        img
-            width: 100px
-    .btn-open
-        margin-right: -14px
-#menu
-    position: fixed
-    top: 0
-    left: 0
-    right: 0
-    bottom: 0
-    background: black
-    color: white
-    overflow-y: scroll
-    z-index: 1000
-    padding-bottom: 30px
-    .avatar
-        width: 80px
-    .menu-content
-        position: relative
-        margin-top: 150px
-        ul
-            list-style-type: none
-            padding: 0
-            li
-                padding: 5px 0
-                span
-                    opacity: 0.2
-        a
-            color: white
-            text-decoration: underline
-            text-decoration-color: #FFFFFF66
-            &:hover
-                text-decoration-color: #FFFFFFFF
+.dashboard-index
+    .pure__section
+        .float-end
+            // No icon in cards
+            display: none
+
+.draggable-item
+    margin-bottom: $spacing1
 
 .hero
     padding-top: 150px
     padding-bottom: 30px
     background-color: $color-background-alt
     margin-bottom: 30px
+    @media (min-height: 800px)
+        padding-top: 250px
 
 main
     min-height: 70vh
@@ -125,16 +93,8 @@ a
     color: $color-accent
     font-weight: bold
 
-.btn-xs
-    font-size: 14px
-    padding: 2px 7px
-
-.btn-light
-    background: $color-background
-    border-color: $color-border
-
 .commands
-    background: $color-background-alt
+    background: $color-commands
     position: sticky
     bottom: 0
     left: 0
@@ -155,30 +115,20 @@ a
     &__description
         font-size: px2rem(14)
 
-.filters
-    position: absolute
-    top: 0
-    right: 0
-    margin-top: 0 !important
-
-#collapseFilters
-    padding-top: 0 !important
-    + br
-        display: none
-
 .sdfi-deletable-file__preview
     margin-top: 10px
 
-#collapseFilters
-    padding-top: 50px
-
 .table
     input[type=checkbox]
         margin-right: 10px
     th
         color: $color-text-alt
+        font-size: $form-label-font-size
         font-weight: normal
 
+.handle
+    margin-right: $spacing0
+
 footer
     min-height: 300px
     a

app/assets/stylesheets/admin/pure/variables.sass

@@ -6,6 +6,8 @@ $color-border: rgba(0, 0, 0, 0.1)
 $color-background-alt: #F2F2F2
 $color-background: #FFFFFF
 
+$color-commands: #222222
+
 $color-valid: #BEDABE
 
 // Spacing

app/assets/stylesheets/commons/_block.sass

@@ -6,25 +6,21 @@
         display: none
 
 .fake-table
-    display: table
     border-collapse: collapse
     caption-side: bottom
-    border: 1px solid $border-color
+    display: table
     .thead, .tbody
         display: table-row-group
+        .tr
+            .td
+                padding-bottom: 5px
+                padding-right: 5px
     .tr
         display: table-row
-        border-bottom: 1px solid $border-color
     .td
         display: table-cell
         min-width: 120px
-        &:not(:first-child)
-            border-left: 1px solid  $border-color
     .thead
         white-space: nowrap
-    .tbody
-        .tr
-            &:nth-child(even)
-                background: $table-striped-bg
-            &:hover
-                background: $table-hover-bg
+        .btn-danger
+            margin-left: 5px