@dashadmin/dash-styles 1.3.17 → 1.3.19

package/dist/styles/mui-overrides.less

@@ -0,0 +1,62 @@
+.MuiTablePagination-displayedRows {
+    margin-right:15px;
+}
+
+/*
+.MuiToolbar-root {
+    // Removes default ReactAdmin white background
+    background: inherit;
+    //justify-content: flex-start !important;
+
+}
+*/
+
+/*.RaBulkActionsToolbar-toolbar { 
+    background: var(--header-bg);
+}*/
+
+.MuiTablePagination-toolbar {
+        background-color: transparent !important;
+        justify-content: center;
+        align-items: baseline;
+}
+
+.MuiFormLabel-root{
+    &.MuiInputLabel-shrink{
+        top: -2px !important;
+    }
+}
+
+.MuiStack-root-RaLabeled-root{
+    width: 100%;
+    margin-bottom: 1rem !important;
+}
+
+.MuiStack-root {
+    align-items: stretch;
+}
+
+// Fixed Mui Field Inputs
+.MuiAutocomplete-root {
+    width: 100%;
+}
+
+.RaList-actions {
+    .MuiAutocomplete-input {
+        //width: 160px !important;
+        width:100% !important;
+
+    }
+
+    .MuiInputBase-root {
+        //width: 217px;
+        flex-wrap: inherit;
+    }
+}
+
+
+@media screen and (max-width: 576px) {
+  .MuiPaper-root {
+    overflow-x: none !important;
+  }
+}

package/dist/styles/notification.less

@@ -0,0 +1,46 @@
+.dash-notification .MuiSnackbarContent-message {
+    padding: 20px;
+}
+
+.dash-media{
+    /*.dash-user-thumb{
+
+    }*/
+    &-body{
+        .table{
+            width: 100%;
+            border: 1px solid rgba(#000000, .12);
+            margin-top: 1rem;
+            border-collapse: collapse;
+            th, td{
+                padding: 5px 10px;
+                border: 1px solid rgba(#000000, .12);
+            }
+            th{
+                background-color: rgba(#000000, .12);
+                font-size: 12px;
+            }
+            td{
+                vertical-align: top;
+                min-width: 90px;
+                font-size: 11px;
+            }
+        }
+    }
+}
+
+
+/*
+.dash-notification .RaNotification-success {
+    
+}
+.dash-notification .RaNotification-info {
+    
+}
+.dash-notification .RaNotification-warning {
+    
+}
+.dash-notification .RaNotification-error {
+    
+}
+*/

package/dist/styles/pages/profile.less

@@ -0,0 +1,139 @@
+.dash-profile {
+  &-img{
+      display: flex;
+      margin: 0 auto 2rem;
+      width: 160px;
+      height: 160px;
+      border-radius: 50%;
+      justify-content: center;
+      align-items: center;
+      position: relative;
+      img{
+          width: 100%;
+          height: 100%;
+          position: relative;
+          object-fit: cover;
+          border-radius: 50%;
+      }
+  }
+  &-icon{
+      display: flex;
+      width: 100%;
+      height: 100%;
+      background-color: #FFB74D;
+      justify-content: center;
+      align-items: center;
+      position: relative;
+      border-radius: 50%;
+  }
+  &-edit{
+      display: flex;
+      width: 42px;
+      height: 42px;
+      border-radius: 50%;
+      background-color: var(--highlight-color) !important;
+      justify-content: center;
+      align-items: center;
+      position: absolute !important;
+      top: 0;
+      right: 10px;
+      box-shadow: 0 5px 6px rgba(#000000, .38);
+  }
+}
+
+
+// Moved to sidebar
+/*
+.dash-user{
+  &-avatar{
+      .MuiAvatar-root{
+          width: 65px;
+          height: 65px;
+          background-color: @primary-color;
+      }
+  }
+  &-menu{
+      .MuiList-root.MuiList-padding.MuiMenu-list{
+          padding: .5rem .75rem;
+      }
+      .MuiPaper-root.MuiMenu-paper.MuiPaper-elevation{
+          overflow: visible;
+          transform: translateY(10px) !important;
+          filter: drop-shadow(0px 6px 16px rgba(0, 0, 0, 0.08));
+          &::before{
+              content: "";
+              display: block;
+              width: 12px;
+              height: 12px;
+              background: var('--module-bg');
+              transform: rotate(-45deg);
+              position: absolute;
+              top: -6px;
+              left: 25px;
+              z-index: 99;
+          }
+      }
+  }
+  &-name{
+      display: block;
+      width: 100%;
+      padding: 6px 4px .5rem;
+      border-bottom: 1px solid #ddd;
+      font-style: normal;
+      font-weight: 900;
+      font-size: 14px;
+      line-height: 16px;
+      margin-bottom: .5rem;
+  }
+  &-item{
+      .MuiTypography-root{
+          font-family: 'Montserrat';
+          font-style: normal;
+          font-weight: 500;
+          font-size: 14px;
+          line-height: 22px;
+          color: @sidebar_submenu-color-primary;
+      }
+  }
+  &-icon{
+      display: inline-block;
+      width: 18px;
+      height: 18px;
+      margin: 0 10px 0 0;
+      min-width: auto;
+      color:inherit;
+      svg{
+          width: 18px;
+          height: 18px;
+          object-fit: contain;
+          color: inherit;
+          path{
+              fill: inherit;
+          }
+      }
+  }
+
+  @media (max-width: @mq-sm){
+
+
+      &-avatar{
+          .MuiAvatar-root{
+              width: 30px;
+              height: 30px;
+          }
+      }
+
+      &-menu{
+          .MuiPaper-root.MuiMenu-paper.MuiPaper-elevation{
+              &::before{
+                  right: 10px;
+                  left: auto;
+              }
+          }
+      }
+
+  }
+
+
+}
+*/

package/dist/styles/pagination.less

@@ -0,0 +1,90 @@
+.MuiTablePagination-actions {
+	margin-left: 1rem !important;
+}
+.MuiPaginationItem-root {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	padding: 5px 6px;
+	width: 32px;
+	height: 32px;
+	background: var(--highlight-color);
+	border: 1px solid var(--module-bg);
+	border-radius: 2px;
+
+	font-style: normal;
+	font-weight: 400;
+	font-size: 14px;
+	line-height: 22px;
+	text-align: center;
+	color: #262626;
+
+	&.Mui-selected {
+		background: var(--highlight-color);
+		border: 1px solid var(--primary-color);
+		color: var(--primary-color);
+	}
+
+	&.MuiPaginationItem-previousNext {
+		background: var(--primary-color);
+		border: 1px solid var(--primary-color);
+		color: var(--highlight-color);
+	}
+
+	&.Mui-disabled {
+		background: #f5f5f5;
+		border: 1px solid var(--module-bg);
+		color: #bfbfbf;
+	}
+}
+
+.dash-pagination-component {
+//	background-color: #f5f5f5;
+//  z-index: 800;
+//	position: fixed;
+	bottom: 15px;
+	right: 20px;
+
+	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
+	border-radius: 8px;
+	.MuiTablePagination-select {
+		background-color: var(--primary-color);
+    color: var(--highlight-color);
+    font-weight: bold;
+    font-size: 10px;
+	}
+}
+
+.MuiPaginationItem-page {
+  display: inline-flex;
+  -webkit-box-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  justify-content: center;
+  position: relative;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0px;
+  border: 0px;
+  cursor: pointer;
+  user-select: none;
+  vertical-align: middle;
+  appearance: none;
+  text-decoration: none;
+  font-family: Roboto, Helvetica, Arial, sans-serif;
+  font-weight: 400;
+  font-size: 0.875rem;
+  line-height: 1.43;
+  letter-spacing: 0.01071em;
+  border-radius: 13px;
+  text-align: center;
+  box-sizing: border-box;
+  min-width: 26px;
+  height: 26px;
+  padding: 0px 4px;
+  margin: 0px 1px;
+  color: rgb(35, 48, 68);
+  transition: color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+

package/dist/styles/popover.less

@@ -0,0 +1,21 @@
+.ant-popover{
+    &-title{
+        padding: 5px 16px;
+        font-family: 'Montserrat';
+        font-style: normal;
+        font-weight: 700;
+        font-size: 14px;
+        line-height: 22px;
+        color: var(--primary-color);
+        border-bottom: 1px solid #F0F0F0;
+    }
+    &-inner-content{
+        padding: 12px 16px;
+        font-family: 'Montserrat';
+        font-style: normal;
+        font-weight: 400;
+        font-size: 14px;
+        line-height: 22px;
+        color: #262626;
+    }
+}

package/dist/styles/react-admin/common.less

@@ -0,0 +1,184 @@
+/*.RaList-content {
+  //overflow: scroll !important;
+}*/
+/*
+.dash-app-module {
+  .RaList-actions > .MuiPaper-root {
+    background-color: inherit;
+    border-radius: inherit;
+    box-shadow: inherit;
+  }
+  .RaList-main > .MuiPaper-root {
+    background-color: inherit;
+    border-radius: inherit;
+    box-shadow: inherit;
+  }
+}*/
+
+.dash-module-box-content div:empty,
+.edit-page div:empty,
+.show-page div:empty,
+.view-page div:empty,
+.create-page div:empty
+{
+  display: none;
+}
+
+
+.MuiStack-root {
+  align-items: stretch !important;
+}
+
+.top-toolbar {
+
+      .MuiToolbar-root {
+
+          //background-color: #F6F7FC;
+          //border-right: 1px solid #c8c8c8;
+          padding-bottom:0px;
+          padding-right: 10px;
+          //margin-right: 35px;
+
+      }
+
+}
+
+.RaCreate-main, .RaEdit-main  {
+  > .MuiPaper-root {
+    background-color: inherit;
+    border-radius: inherit;
+    box-shadow: inherit;
+  }
+  /*form {
+    > .MuiToolbar-root {
+      margin-top: 15px;
+    }
+  }*/
+}
+/* Hack - for some reason RA adds an empty span immediately after */
+.RaList-actions > span {
+    display: none;
+}
+
+.RaList-actions {
+    display: block !important;
+    //margin-bottom: 15px;
+    form {
+      min-height: auto;
+    }
+}
+
+
+.list-page .RaList-main {
+  width: 100%;
+  // To give paginator space
+   //padding-bottom: 80px;
+   //margin-bottom: 80px;
+}
+
+/* This is mented to show a horizontal scroll feature when not all elements of bulk actions fit */
+
+/*.RaBulkActionsToolbar-topToolbar {
+  overflow-x: scroll;
+}*/
+
+/*.RaFilterForm-filterFormInput .MuiFormControl-root {
+  //min-width: 217px;
+  width: 100%;
+}*/
+
+.toolbar-filters {
+  width: 100%
+
+}
+
+.filter-field {
+  width: 25%;
+}
+
+@media (max-width: @mq-lg){
+  .filter-field {
+    width: 33%;
+  }
+}
+
+
+@media (max-width: @mq-md){
+  .filter-field {
+    width: 50%;
+  }
+}
+
+@media (max-width: @mq-sm){
+  .filter-field {
+    width: 100%;
+  }
+}
+
+/*
+.MuiToolbar-root.RaBulkActionsToolbar-toolbar {
+  min-height: unset !important;
+  -webkit-transform: translateY(0px) !important;
+  -moz-transform: translateY(0px) !important;
+  -ms-transform: translateY(0x) !important;
+  transform: translateY(0px) !important;
+  position: relative !important;
+  width: 100%;
+  //overflow-x: scroll;
+}
+*/
+
+.MuiSelect-select .RaSelectArrayInput-chips {
+  display: contents !important;
+}
+
+.MuiSelect-select:hover .RaSelectArrayInput-chips {
+  //display: flex !important;
+  position: absolute;
+  background: white;
+  border-radius: 14px;
+  padding: 4px;
+}
+
+.RaDatagrid-tableWrapper table {
+  margin-top: auto !important;
+}
+
+
+
+.RaList-actions {
+    padding: 15px 5px;
+    background: var(--module-bg);
+    border-radius: 8px;
+    margin-bottom:3px;  
+}
+
+.RaDatagrid-root {
+  [class*="RaBulkActionsToolbar-root"] {
+    position: inherit;
+    //background-color: var(--primary-contrast);
+    background-color: 'none';
+  }
+}
+
+/*.RaEdit-main {
+    padding: 5px 0px 0px 5px;
+}
+*/
+
+// This is to override RA's display flex that breaks our layouts
+.RaEdit-main, .RaCreate-main { 
+    display: block !important;
+}
+
+.RaSingleFieldList-root {
+  .RaSingleFieldList-link > * {
+    color: var(--text-color);
+  }
+}
+
+.RaReferenceField-root {
+  .RaReferenceField-link > * {
+    color: var(--text-color);
+  }
+}

package/dist/styles/react-admin/toolbar.less

@@ -0,0 +1,22 @@
+/*.RaList-main > .MuiToolbar-root {
+    margin-bottom: 15px;
+}*/
+
+/*
+.edit-page,
+.create-page {
+  margin-bottom: 60px; // The height of the bottom toolbar
+}
+*/
+
+/*
+.RaToolbar-mobileToolbar {
+  background: none !important;
+
+}
+
+.RaToolbar-desktopToolbar {
+   background: none !important;
+
+}
+   */

package/dist/styles/root.less

@@ -0,0 +1,13 @@
+/*:root {
+  color-scheme: only light;
+}*/
+
+#root {
+  margin:0;
+  padding: 0;
+}
+html,body {
+ margin: 0;
+  padding: 0;
+
+}