Start new branch for monitor dashboard redesign

.gitmodules

@@ -7,3 +7,6 @@
 [submodule "src/assets/dashboard-theme"]
 	path = src/assets/dashboard-theme
 	url = gitea@code-repo.d4science.org:MaDgIK/dashboard-theme.git
+[submodule "src/assets/openaire-theme"]
+	path = src/assets/openaire-theme
+	url = gitea@code-repo.d4science.org:MaDgIK/openaire-theme.git

src/app/openaireLibrary

@@ -1 +1 @@
-Subproject commit 514cd0dd12407f0b3c09d5f20c39a546888165a9
+Subproject commit 31e56588271d0ed3fc64990a35ac007e7aa4b2b3

src/assets/common-assets

@@ -1 +1 @@
-Subproject commit 04d799f089c93ae28c9d2ca8436f283ebc0be3ae
+Subproject commit 4e99b0887c758579682eb1d9848d227e18f97799

src/assets/dashboard-theme

@@ -1 +1 @@
-Subproject commit 3534471c8c7dcd58d53cb8ad84a92e051ef72dd8
+Subproject commit a9e0079b207d8e2894f71fff5b683afe44d3eb57

src/assets/new.css

@@ -1,249 +1,249 @@
-:root {
+/*:root {*/
-  --portal-main-color: #8DCA26;
+/*  --portal-main-color: #8DCA26;*/
-  --portal-main-contrast: white;
+/*  --portal-main-contrast: white;*/
-  --portal-dark-color: #7c9144;
+/*  --portal-dark-color: #7c9144;*/
-}
-
-.stakeholderPage {
-  --primary-color: var(--theme-secondary-color);
-  --secondary-color: var(--theme-secondary-color);
-  --primary-color-rgb: var(--theme-secondary-color-rgb);
-  --secondary-color-rgb: var(--theme-secondary-color-rgb);
-}
-/*Stakeholder Specific*/
-.publicationsSearchForm {
-  background-image: none;
-}
-
-.stakeholderPage #page_content {
-  background-image: url("~src/assets/monitor-shapes-bg.svg");
-  background-size: contain;
-  background-repeat: no-repeat;
-  background-position: bottom;
-  background-attachment: fixed;
-  min-height: calc(70vh - var(--header-height));
-}
-
-/*General*/
-.stakeholderPage {
-  background: #F9FBFC !important;
-}
-
-#style_switcher .uk-offcanvas-bar {
-  box-sizing: border-box;
-  padding: 16px;
-}
-
-#style_switcher_toggle {
-  top: 320px !important;
-  position: fixed;
-  height: 36px;
-  /*background: #fff;*/
-  background-color: rgb(255, 255, 255);
-  border-radius: 4px 0 0 4px;
-  cursor: pointer;
-  padding: 0 8px;
-  box-shadow: -2px 2px 5px rgba(0, 0, 0, .26);
-  box-sizing: border-box;
-  /*z-index: 981;*/
-}
-
-#filters_switcher_toggle {
-  top: 320px !important;
-  position: fixed;
-  height: 36px;
-  background-color: var(--secondary-color);
-  border-radius: 4px 0 0 4px;
-  cursor: pointer;
-  padding: 0 2px;
-  box-shadow: -2px 2px 5px rgba(0, 0, 0, .26);
-  box-sizing: border-box;
-  /*z-index: 981;*/
-  right: 0;
-}
-
-/*Sidebar*/
-/*Style*/
-/*#sidebar_main .menu_section > ul li.uk-active > a {*/
-/*    font-size: var(--sidebar-font-size);*/
-/*    color: rgba(0,0,0,.7);*/
 /*}*/
-/*Sidebar Header logo */
-#sidebar_main .sidebar_main_header .portal-logo {
-  background: url("~src/assets/common-assets/logo-large-monitor.png") no-repeat;
-  background-size: contain;
-}
 
-.sidebar_mini #sidebar_main .sidebar_main_header .portal-logo {
+/*.stakeholderPage {*/
-  background: url("~src/assets/common-assets/logo-small-monitor.png") no-repeat;
+/*  --primary-color: var(--theme-secondary-color);*/
-  background-size: contain;
+/*  --secondary-color: var(--theme-secondary-color);*/
-}
+/*  --primary-color-rgb: var(--theme-secondary-color-rgb);*/
+/*  --secondary-color-rgb: var(--theme-secondary-color-rgb);*/
+/*}*/
+/*!*Stakeholder Specific*!*/
+/*.publicationsSearchForm {*/
+/*  background-image: none;*/
+/*}*/
 
-/*Sidebar Rotation*/
+/*.stakeholderPage #page_content {*/
+/*  background-image: url("~src/assets/monitor-shapes-bg.svg");*/
+/*  background-size: contain;*/
+/*  background-repeat: no-repeat;*/
+/*  background-position: bottom;*/
+/*  background-attachment: fixed;*/
+/*  min-height: calc(70vh - var(--header-height));*/
+/*}*/
 
-.stakeholderPage #sidebar_main .menu_section > ul > li.uk-active {
+/*!*General*!*/
-  width: 150px;
+/*.stakeholderPage {*/
-  height: 100%;
+/*  background: #F9FBFC !important;*/
-  transition: 0.70s;
+/*}*/
-  -webkit-transition: 0.70s;
-  -moz-transition: 0.70s;
-  -ms-transition: 0.70s;
-  -o-transition: 0.70s;
-  -webkit-transform: rotate(-90deg);
-  -moz-transform: rotate(-90deg);
-  -o-transform: rotate(-90deg);
-  -ms-transform: rotate(-90deg);
-  transform: rotate(-90deg);
-  margin: 63px auto 63px auto;
-}
 
-.stakeholderPage #sidebar_main .menu_section > ul > li {
+/*#style_switcher .uk-offcanvas-bar {*/
-  transition: 0.70s;
+/*  box-sizing: border-box;*/
-  -webkit-transition: 0.70s;
+/*  padding: 16px;*/
-  -moz-transition: 0.70s;
+/*}*/
-  -ms-transition: 0.70s;
+
-  -o-transition: 0.70s;
+/*#style_switcher_toggle {*/
+/*  top: 320px !important;*/
+/*  position: fixed;*/
+/*  height: 36px;*/
+/*  !*background: #fff;*!*/
+/*  background-color: rgb(255, 255, 255);*/
+/*  border-radius: 4px 0 0 4px;*/
+/*  cursor: pointer;*/
+/*  padding: 0 8px;*/
+/*  box-shadow: -2px 2px 5px rgba(0, 0, 0, .26);*/
+/*  box-sizing: border-box;*/
+/*  !*z-index: 981;*!*/
+/*}*/
+
+/*#filters_switcher_toggle {*/
+/*  top: 320px !important;*/
+/*  position: fixed;*/
+/*  height: 36px;*/
+/*  background-color: var(--secondary-color);*/
+/*  border-radius: 4px 0 0 4px;*/
+/*  cursor: pointer;*/
+/*  padding: 0 2px;*/
+/*  box-shadow: -2px 2px 5px rgba(0, 0, 0, .26);*/
+/*  box-sizing: border-box;*/
+/*  !*z-index: 981;*!*/
+/*  right: 0;*/
+/*}*/
+
+/*!*Sidebar*!*/
+/*!*Style*!*/
+/*!*#sidebar_main .menu_section > ul li.uk-active > a {*!*/
+/*!*    font-size: var(--sidebar-font-size);*!*/
+/*!*    color: rgba(0,0,0,.7);*!*/
+/*!*}*!*/
+/*!*Sidebar Header logo *!*/
+/*#sidebar_main .sidebar_main_header .portal-logo {*/
+/*  background: url("~src/assets/common-assets/logo-large-monitor.png") no-repeat;*/
+/*  background-size: contain;*/
+/*}*/
+
+/*.sidebar_mini #sidebar_main .sidebar_main_header .portal-logo {*/
+/*  background: url("~src/assets/common-assets/logo-small-monitor.png") no-repeat;*/
+/*  background-size: contain;*/
+/*}*/
+
+/*!*Sidebar Rotation*!*/
+
+/*.stakeholderPage #sidebar_main .menu_section > ul > li.uk-active {*/
+/*  width: 150px;*/
+/*  height: 100%;*/
+/*  transition: 0.70s;*/
+/*  -webkit-transition: 0.70s;*/
+/*  -moz-transition: 0.70s;*/
+/*  -ms-transition: 0.70s;*/
+/*  -o-transition: 0.70s;*/
+/*  -webkit-transform: rotate(-90deg);*/
+/*  -moz-transform: rotate(-90deg);*/
+/*  -o-transform: rotate(-90deg);*/
+/*  -ms-transform: rotate(-90deg);*/
+/*  transform: rotate(-90deg);*/
+/*  margin: 63px auto 63px auto;*/
+/*}*/
+
+/*.stakeholderPage #sidebar_main .menu_section > ul > li {*/
+/*  transition: 0.70s;*/
+/*  -webkit-transition: 0.70s;*/
+/*  -moz-transition: 0.70s;*/
+/*  -ms-transition: 0.70s;*/
+/*  -o-transition: 0.70s;*/
+/*  !*display: block;*!*/
+/*  !*text-align: center;*!*/
+/*  !*margin-right: auto;*!*/
+/*  !*margin-left: auto;*!*/
+/*}*/
+
+/*.stakeholderPage.sidebar_mini #sidebar_main .menu_section > ul > li.uk-active {*/
+/*  -webkit-transform: rotate(0deg);*/
+/*  -moz-transform: rotate(0deg);*/
+/*  -o-transform: rotate(0deg);*/
+/*  -ms-transform: rotate(0deg);*/
+/*  transform: rotate(0deg);*/
+/*  width: inherit;*/
+/*  height: inherit;*/
+/*  margin: 4px 0 0;*/
+/*}*/
+
+
+/*.stakeholderPage #sidebar_main #sidebar_content, .stakeholderPage #sidebar_switcher_toggle {*/
+/*  border-color: var(--monitor-portal-color);*/
+/*}*/
+
+/*!* Section Tools*!*/
+
+/*.dashboard .section {*/
+/*  padding-top: 10px;*/
+/*  padding-bottom: 10px;*/
+/*  padding-right: 10px;*/
+/*  border: rgba(0, 0, 0, 0) solid 1px;*/
+/*  position: relative;*/
+/*}*/
+
+/*.dashboard .section .tools {*/
+/*  position: absolute;*/
+/*  top: 0;*/
+/*  left: 50%;*/
+/*  transform: translate(-50%, -100%);*/
+/*  width: 50px;*/
+/*  max-width: 50px;*/
+/*  background: var(--secondary-color);*/
+/*  color: var(--contrast-color);*/
+/*  -webkit-clip-path: polygon(20% 5%, 80% 5%, 100% 100%, 0% 100%);*/
+/*  clip-path: polygon(20% 5%, 80% 5%, 100% 100%, 0% 100%);*/
+/*  display: none;*/
+/*  padding-left: 10px;*/
+/*}*/
+
+/*.dashboard .section {*/
+/*  border: transparent solid 1px;*/
+/*}*/
+
+/*.dashboard .section:hover {*/
+/*  border: var(--secondary-color) solid 1px;*/
+/*}*/
+
+/*.dashboard .section:hover .tools {*/
 /*  display: block;*/
-  /*text-align: center;*/
+/*}*/
-  /*margin-right: auto;*/
-  /*margin-left: auto;*/
-}
 
-.stakeholderPage.sidebar_mini #sidebar_main .menu_section > ul > li.uk-active {
+/*.dashboard .section:hover .tools a {*/
-  -webkit-transform: rotate(0deg);
+/*  color: currentColor;*/
-  -moz-transform: rotate(0deg);
+/*}*/
-  -o-transform: rotate(0deg);
-  -ms-transform: rotate(0deg);
-  transform: rotate(0deg);
-  width: inherit;
-  height: inherit;
-  margin: 4px 0 0;
-}
 
 
-.stakeholderPage #sidebar_main #sidebar_content, .stakeholderPage #sidebar_switcher_toggle {
+/*!* New section*!*/
-  border-color: var(--monitor-portal-color);
+/*.dashboard .new-section {*/
-}
+/*  border: #707070 dashed 1px;*/
+/*  border-radius: 2px;*/
+/*  background-color: white;*/
+/*  min-height: 200px;*/
+/*  position: relative;*/
+/*  box-shadow: 0 2px 6px #00000038;*/
+/*}*/
 
-/* Section Tools*/
+/*.dashboard .new-section .tools {*/
+/*  position: absolute;*/
+/*  top: 50%;*/
+/*  left: 50%;*/
+/*  transform: translate(-50%, -50%);*/
+/*}*/
 
-.dashboard .section {
+/*.dashboard .new-section .tools .md-btn .material-icons {*/
-  padding-top: 10px;
+/*  position: absolute;*/
-  padding-bottom: 10px;
+/*  top: 50%;*/
-  padding-right: 10px;
+/*  left: 50%;*/
-  border: rgba(0, 0, 0, 0) solid 1px;
+/*  transform: translate(-50%, -50%);*/
-  position: relative;
+/*  margin: 0;*/
-}
+/*}*/
 
-.dashboard .section .tools {
+/*!*Search *!*/
-  position: absolute;
+/*#searchFormPanel {*/
-  top: 0;
+/*  margin-top: 30px;*/
-  left: 50%;
+/*  height: 250px;*/
-  transform: translate(-50%, -100%);
+/*}*/
-  width: 50px;
-  max-width: 50px;
-  background: var(--secondary-color);
-  color: var(--contrast-color);
-  -webkit-clip-path: polygon(20% 5%, 80% 5%, 100% 100%, 0% 100%);
-  clip-path: polygon(20% 5%, 80% 5%, 100% 100%, 0% 100%);
-  display: none;
-  padding-left: 10px;
-}
 
-.dashboard .section {
+/*.visibility {*/
-  border: transparent solid 1px;
+/*  border-right: 1px solid rgba(var(--secondary-color-rgb), 0.5);*/
-}
+/*  border-bottom: 1px solid rgba(var(--secondary-color-rgb), 0.5);*/
+/*  padding: 10px 8px;*/
+/*  margin-right: 4px;*/
+/*  color: rgba(var(--text-color-rgb), 0.5);*/
+/*}*/
 
-.dashboard .section:hover {
+/*.visibility.small {*/
-  border: var(--secondary-color) solid 1px;
+/*  padding: 3px 2px;*/
-}
+/*}*/
 
-.dashboard .section:hover .tools {
+/*.more {*/
-  display: block;
+/*  position: absolute;*/
-}
+/*  transform: translate(-50%, -50%);*/
+/*  right: -30px;*/
+/*  top: 50%;*/
+/*}*/
 
-.dashboard .section:hover .tools a {
+/*.descriptionIcon {*/
-  color: currentColor;
+/*  position: absolute;*/
-}
+/*  bottom: 3px;*/
+/*  left: 3px;*/
+/*}*/
 
+/*.refresh-indicator {*/
+/*  background-color: rgba(0, 0, 0, 0.50);*/
+/*  border-radius: 4px;*/
+/*  position: absolute;*/
+/*  color: white;*/
+/*}*/
 
-/* New section*/
+/*.uk-modal-container .uk-modal-dialog {*/
-.dashboard .new-section {
+/*  width: 900px;*/
-  border: #707070 dashed 1px;
+/*}*/
-  border-radius: 2px;
+/*.stakeholderPage .uk-card.uk-disabled, .stakeholderPage .uk-card.semiFiltered{*/
-  background-color: white;
+/*  opacity: 0.5;*/
-  min-height: 200px;
+/*}*/
-  position: relative;
+/*.stakeholderPage .uk-card.semiFiltered > * > .highcharts-series-group{*/
-  box-shadow: 0 2px 6px #00000038;
+/*  opacity: 0.5;*/
-}
+/*}*/
+/*.stakeholderPage .selectedFilterLabel {*/
+/*  background-color: #E6EEF2;*/
+/*  border-color: #E6EEF2;*/
+/*}*/
 
-.dashboard .new-section .tools {
+/*.landing .uk-dropdown, new-search-page .uk-dropdown, search-all .uk-dropdown {*/
-  position: absolute;
+/*  padding: 25px;*/
-  top: 50%;
+/*}*/
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
-
-.dashboard .new-section .tools .md-btn .material-icons {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  margin: 0;
-}
-
-/*Search */
-#searchFormPanel {
-  margin-top: 30px;
-  height: 250px;
-}
-
-.visibility {
-  border-right: 1px solid rgba(var(--secondary-color-rgb), 0.5);
-  border-bottom: 1px solid rgba(var(--secondary-color-rgb), 0.5);
-  padding: 10px 8px;
-  margin-right: 4px;
-  color: rgba(var(--text-color-rgb), 0.5);
-}
-
-.visibility.small {
-  padding: 3px 2px;
-}
-
-.more {
-  position: absolute;
-  transform: translate(-50%, -50%);
-  right: -30px;
-  top: 50%;
-}
-
-.descriptionIcon {
-  position: absolute;
-  bottom: 3px;
-  left: 3px;
-}
-
-.refresh-indicator {
-  background-color: rgba(0, 0, 0, 0.50);
-  border-radius: 4px;
-  position: absolute;
-  color: white;
-}
-
-.uk-modal-container .uk-modal-dialog {
-  width: 900px;
-}
-.stakeholderPage .uk-card.uk-disabled, .stakeholderPage .uk-card.semiFiltered{
-  opacity: 0.5;
-}
-.stakeholderPage .uk-card.semiFiltered > * > .highcharts-series-group{
-  opacity: 0.5;
-}
-.stakeholderPage .selectedFilterLabel {
-  background-color: #E6EEF2;
-  border-color: #E6EEF2;
-}
-
-.landing .uk-dropdown, new-search-page .uk-dropdown, search-all .uk-dropdown {
-  padding: 25px;
-}

src/assets/openaire-theme

@@ -0,0 +1 @@
+Subproject commit 0a34bf8f62ef7544060acc4e8333ce13ea929d91

src/styles.css

@@ -1,7 +1,7 @@
 /* You can add global styles to this file, and also import other style files */
-@import "assets/common-assets/common/theme.css";
+@import "assets/openaire-theme/css/import.css";
-@import "assets/common-assets/common/custom.css";
 @import "assets/common-assets/library.css";
+@import "assets/common-assets/common/custom.css";
 @import "assets/dashboard-theme/main.css";
 @import "assets/new.css";
 @import "assets/print.css";