From 7edcf3615d7aa80478aaf76a8bff4d892f2a3985 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mikel=20Mart=C3=ADn?= <mikel@moodle.com>
Date: Tue, 20 Apr 2021 12:00:53 +0200
Subject: [PATCH] MDL-70794 theme_boost: SCSS for Report builder filters
 dropdown.

---
 theme/boost/scss/moodle.scss               |  1 +
 theme/boost/scss/moodle/reportbuilder.scss | 46 ++++++++++++++++++++++
 theme/boost/style/moodle.css               | 32 +++++++++++++++
 theme/classic/style/moodle.css             | 32 +++++++++++++++
 4 files changed, 111 insertions(+)
 create mode 100644 theme/boost/scss/moodle/reportbuilder.scss

diff --git a/theme/boost/scss/moodle.scss b/theme/boost/scss/moodle.scss
index 5066ae560bd3f..9eb49651a8691 100644
--- a/theme/boost/scss/moodle.scss
+++ b/theme/boost/scss/moodle.scss
@@ -43,3 +43,4 @@ $breadcrumb-divider-rtl: "◀" !default;
 @import "moodle/atto";
 @import "moodle/toasts";
 @import "moodle/navbar";
+@import "moodle/reportbuilder";
diff --git a/theme/boost/scss/moodle/reportbuilder.scss b/theme/boost/scss/moodle/reportbuilder.scss
new file mode 100644
index 0000000000000..e82df1e72da2b
--- /dev/null
+++ b/theme/boost/scss/moodle/reportbuilder.scss
@@ -0,0 +1,46 @@
+/* Rportbuilder */
+.reportbuilder-table-wrapper {
+    .filters-dropdown {
+        width: 27rem;
+        padding: 0;
+        @include media-breakpoint-down(sm) {
+            width: 100%;
+        }
+    }
+    .reportbuilder-filters-wrapper {
+        .mform {
+            &.full-width-labels {
+                .fitem.row {
+                    > .col-md-3,
+                    > .col-md-9 {
+                        flex: 0 0 100%;
+                        max-width: 100%;
+                    }
+                    .fdate_selector {
+                        flex-wrap: wrap;
+                    }
+                }
+            }
+            .form-group {
+                margin-bottom: 0;
+            }
+        }
+        .filter {
+            .filter-header {
+                font-size: $h5-font-size;
+                .filter-name {
+                    font-size: 1rem;
+                    white-space: nowrap;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                    padding-right: 1rem;
+                }
+                .filter-name:hover {
+                    white-space: normal;
+                    text-overflow: clip;
+                    word-break: break-all;
+                }
+            }
+        }
+    }
+}
diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
index 2bcfc669f2c2b..4866cf964f270 100644
--- a/theme/boost/style/moodle.css
+++ b/theme/boost/style/moodle.css
@@ -20017,6 +20017,38 @@ div.editor_atto_toolbar button .icon {
 #page {
   margin-top: 50px; }
 
+/* Rportbuilder */
+.reportbuilder-table-wrapper .filters-dropdown {
+  width: 27rem;
+  padding: 0; }
+  @media (max-width: 767.98px) {
+    .reportbuilder-table-wrapper .filters-dropdown {
+      width: 100%; } }
+
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .mform.full-width-labels .fitem.row > .col-md-3,
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .mform.full-width-labels .fitem.row > .col-md-9 {
+  flex: 0 0 100%;
+  max-width: 100%; }
+
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .mform.full-width-labels .fitem.row .fdate_selector {
+  flex-wrap: wrap; }
+
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .mform .form-group {
+  margin-bottom: 0; }
+
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .filter .filter-header {
+  font-size: 1.171875rem; }
+  .reportbuilder-table-wrapper .reportbuilder-filters-wrapper .filter .filter-header .filter-name {
+    font-size: 1rem;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    padding-right: 1rem; }
+  .reportbuilder-table-wrapper .reportbuilder-filters-wrapper .filter .filter-header .filter-name:hover {
+    white-space: normal;
+    text-overflow: clip;
+    word-break: break-all; }
+
 body {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale; }
diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css
index 60c4f73915d30..54acfb4b79728 100644
--- a/theme/classic/style/moodle.css
+++ b/theme/classic/style/moodle.css
@@ -20208,6 +20208,38 @@ div.editor_atto_toolbar button .icon {
 #page {
   margin-top: 50px; }
 
+/* Rportbuilder */
+.reportbuilder-table-wrapper .filters-dropdown {
+  width: 27rem;
+  padding: 0; }
+  @media (max-width: 767.98px) {
+    .reportbuilder-table-wrapper .filters-dropdown {
+      width: 100%; } }
+
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .mform.full-width-labels .fitem.row > .col-md-3,
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .mform.full-width-labels .fitem.row > .col-md-9 {
+  flex: 0 0 100%;
+  max-width: 100%; }
+
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .mform.full-width-labels .fitem.row .fdate_selector {
+  flex-wrap: wrap; }
+
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .mform .form-group {
+  margin-bottom: 0; }
+
+.reportbuilder-table-wrapper .reportbuilder-filters-wrapper .filter .filter-header {
+  font-size: 1.171875rem; }
+  .reportbuilder-table-wrapper .reportbuilder-filters-wrapper .filter .filter-header .filter-name {
+    font-size: 1rem;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    padding-right: 1rem; }
+  .reportbuilder-table-wrapper .reportbuilder-filters-wrapper .filter .filter-header .filter-name:hover {
+    white-space: normal;
+    text-overflow: clip;
+    word-break: break-all; }
+
 body {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale; }