update: uniformisation events/resources
This commit is contained in:
Marjolaine Le Bon
parent
55b23ee8b2
commit
eb07bebdd1
@ -6,7 +6,6 @@
|
||||
font-size: 10px;
|
||||
font-family: Open Sans, sans-serif;
|
||||
--sib-notifications-theme: var(--color-primary);
|
||||
|
||||
body {
|
||||
background-color: var(--color-main-background);
|
||||
box-sizing: border-box;
|
||||
@ -16,20 +15,19 @@
|
||||
height: -webkit-fill-available;
|
||||
min-height: -webkit-fill-available;
|
||||
}
|
||||
|
||||
.notLoggedIn {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Fix for solid-dashboard fixture */
|
||||
|
||||
solid-dashboard section {
|
||||
padding: 1rem !important;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
padding: 4.2rem !important;
|
||||
}
|
||||
|
||||
.icon {
|
||||
display: inline-block;
|
||||
}
|
||||
@ -37,15 +35,10 @@ solid-dashboard section {
|
||||
|
||||
.wrapper {
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
"header"
|
||||
"content";
|
||||
|
||||
grid-template-areas: "header" "content";
|
||||
@include breakpoint(lg) {
|
||||
grid-template-columns: 265px auto;
|
||||
grid-template-areas:
|
||||
"header header"
|
||||
"leftmenu content";
|
||||
grid-template-areas: "header header" "leftmenu content";
|
||||
}
|
||||
}
|
||||
|
||||
@ -55,23 +48,20 @@ solid-dashboard section {
|
||||
|
||||
.left-menu {
|
||||
grid-area: leftmenu;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
height: calc(100vh - 83px); /* 83px = nav height */
|
||||
height: calc(100vh - 83px);
|
||||
/* 83px = nav height */
|
||||
position: sticky;
|
||||
top: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
&.jsLeftMenu {
|
||||
display: none;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
&.jsLeftMenu[open] {
|
||||
display: block;
|
||||
bottom: 0;
|
||||
@ -81,7 +71,6 @@ solid-dashboard section {
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
display: none;
|
||||
}
|
||||
@ -90,7 +79,6 @@ solid-dashboard section {
|
||||
|
||||
.content {
|
||||
grid-area: content;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
@ -101,76 +89,77 @@ solid-dashboard section {
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Add scrollbar to the left and right menu, and to the content */
|
||||
nav, .views-container, .table-wrapper {
|
||||
|
||||
nav,
|
||||
.views-container,
|
||||
.table-wrapper {
|
||||
overflow: auto;
|
||||
height: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
-ms-overflow-style: none;
|
||||
}
|
||||
|
||||
|
||||
/* Custom scrollbar of the left-menu */
|
||||
|
||||
nav {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--color-scrollbar-left-track) var(--color-scrollbar-left-background);
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background: var(--color-scrollbar-left-background);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: var(--color-scrollbar-left-track);
|
||||
border-radius: 6px;
|
||||
border: 3px solid var(--color-scrollbar-left-background);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 11px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Custom scrollbar of the content */
|
||||
|
||||
.views-container {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--color-scrollbar-right-track) var(--color-scrollbar-right-background);
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background: var(--color-scrollbar-right-background);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: var(--color-scrollbar-right-track);
|
||||
border-radius: 6px;
|
||||
border: 3px solid var(--color-scrollbar-right-background);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 11px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Custom scrollbar of the table */
|
||||
|
||||
.table-wrapper {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--color-scrollbar-table-track) var(--color-scrollbar-table-background);
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background-color: var(--color-scrollbar-table-background);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
height: 5px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: var(--color-scrollbar-table-track);
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Quick fix. Will be removed later */
|
||||
|
||||
#admin-circles,
|
||||
#admin-projects,
|
||||
#admin-users {
|
||||
@ -196,7 +185,6 @@ h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-weight: bold;
|
||||
|
||||
/*span {
|
||||
font-weight: 400;
|
||||
padding-left: 0.85rem;
|
||||
@ -207,17 +195,18 @@ h6 {
|
||||
}*/
|
||||
}
|
||||
|
||||
h1, .h1-like {
|
||||
h1,
|
||||
.h1-like {
|
||||
color: var(--color-h1);
|
||||
font-size: 2rem;
|
||||
text-transform: uppercase;
|
||||
|
||||
&.without-margin {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
h2, .h2-like {
|
||||
h2,
|
||||
.h2-like {
|
||||
color: var(--color-h2);
|
||||
font-size: 1.8rem;
|
||||
text-transform: uppercase;
|
||||
@ -251,7 +240,6 @@ h5 {
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
background-color: white;
|
||||
height: 100%;
|
||||
@ -262,7 +250,6 @@ h5 {
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
object {
|
||||
height: 45%;
|
||||
width: 45%;
|
||||
@ -284,7 +271,6 @@ h5 {
|
||||
flex-direction: column;
|
||||
flex-grow: 1;
|
||||
margin: 2rem 1rem 5rem 2rem;
|
||||
|
||||
&.full-width {
|
||||
background: var(--color-white);
|
||||
flex: 1;
|
||||
@ -294,53 +280,47 @@ h5 {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Header inside circle, project view */
|
||||
|
||||
.content-box__header {
|
||||
border-bottom: 1px solid var(--color-content-header);
|
||||
padding: 1.8rem 0 1.4rem;
|
||||
margin: 0 1.6rem;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
padding: 3rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.mobile-sidebar-button {
|
||||
float: right;
|
||||
color: var(--color-secondary);
|
||||
font-size: 1.8rem;
|
||||
font-weight: bold!important;
|
||||
|
||||
&::before {
|
||||
font-size: 2.2rem;
|
||||
font-weight: normal;
|
||||
margin-right: 1.2rem;
|
||||
}
|
||||
|
||||
@include breakpoint(lg) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
solid-display {
|
||||
@include breakpoint(sm) {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* For solid-display on project, circle, or private message view */
|
||||
solid-display {
|
||||
width: calc(100% - 94px); /* 94px = width of .mobile-sidebar-button */
|
||||
|
||||
width: calc(100% - 94px);
|
||||
/* 94px = width of .mobile-sidebar-button */
|
||||
div {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: calc(100% - 20px);
|
||||
|
||||
.h1-aside {
|
||||
font-size: 1.8rem;
|
||||
|
||||
&:not(:empty)::before {
|
||||
color: var(--color-grey-4);
|
||||
content: ' - ';
|
||||
@ -348,12 +328,9 @@ h5 {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
color: var(--color-grey-4);
|
||||
|
||||
}
|
||||
|
||||
.name {
|
||||
color: var(--color-grey-4);
|
||||
font-weight: normal;
|
||||
@ -363,8 +340,8 @@ h5 {
|
||||
}
|
||||
|
||||
.content-box__height {
|
||||
min-height: calc(100vh - 50px - 56px); /* Heights of main header and sub-header */
|
||||
|
||||
min-height: calc(100vh - 50px - 56px);
|
||||
/* Heights of main header and sub-header */
|
||||
@include breakpoint(lg) {
|
||||
min-height: calc(100vh - 83px - 84px);
|
||||
}
|
||||
@ -373,16 +350,15 @@ h5 {
|
||||
.content-box__info {
|
||||
flex-direction: column;
|
||||
padding: 1rem;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
padding: 3.2rem;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*.modal {
|
||||
color: var(--color-white);
|
||||
margin: 75px;
|
||||
@ -412,28 +388,23 @@ h5 {
|
||||
align-items: flex-start;
|
||||
margin-bottom: 20px;
|
||||
/*end */
|
||||
|
||||
@include breakpoint(lg) {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 5rem;
|
||||
}
|
||||
|
||||
h3 {
|
||||
/* Quick fix for alignment on mobile before admin content rework */
|
||||
margin-bottom: 20px;
|
||||
/* end */
|
||||
|
||||
@include breakpoint(lg) {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
solid-ac-checker,
|
||||
solid-link {
|
||||
width: 100%;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
width: auto;
|
||||
}
|
||||
@ -446,13 +417,11 @@ h5 {
|
||||
font-size: 1.5rem;
|
||||
margin: 2rem 0 0 2rem;
|
||||
text-decoration: underline;
|
||||
|
||||
&::before {
|
||||
font-size: 2rem;
|
||||
margin-right: 1rem;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&.right {
|
||||
display: block;
|
||||
text-align: right;
|
||||
@ -469,7 +438,6 @@ h5 {
|
||||
|
||||
.desktop-button__end {
|
||||
display: block;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
@ -478,7 +446,6 @@ h5 {
|
||||
|
||||
.space-between {
|
||||
justify-content: space-between;
|
||||
|
||||
&.with-padding {
|
||||
padding-bottom: 1.4rem;
|
||||
}
|
||||
@ -486,7 +453,6 @@ h5 {
|
||||
|
||||
.mobile-vertical-align {
|
||||
flex-direction: column;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
flex-direction: row;
|
||||
}
|
||||
@ -502,7 +468,6 @@ h5 {
|
||||
|
||||
.mobile-margin__bottom {
|
||||
margin-bottom: 1rem;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
@ -514,7 +479,6 @@ h5 {
|
||||
@import 'header';
|
||||
@import 'menu-left';
|
||||
@import 'user-thumb';
|
||||
|
||||
// Button global CSS
|
||||
solid-delete,
|
||||
solid-route,
|
||||
@ -528,217 +492,169 @@ a,
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
|
||||
&.button {
|
||||
padding: 0.55rem 2.5rem;
|
||||
border-radius: 100em;
|
||||
|
||||
*,
|
||||
& {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
&.mobile-full-width {
|
||||
margin-bottom: 1rem;
|
||||
padding-left: 5rem;
|
||||
width: -webkit-fill-available;
|
||||
width: -moz-available;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
margin-bottom: 0;
|
||||
padding-left: 2.5rem;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
&::before {
|
||||
margin-left: -2.6rem;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.desktop-btn-margin__left {
|
||||
margin: 0;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
margin-left: 2.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
&.small {
|
||||
|
||||
*,
|
||||
& {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
&.text-bold {
|
||||
|
||||
*,
|
||||
& {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
&.text-uppercase {
|
||||
|
||||
*,
|
||||
& {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
||||
&.rounded {
|
||||
border-radius: 50%;
|
||||
font-size: 1.8rem;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
&.button-link {
|
||||
border-radius: 100em;
|
||||
|
||||
*,
|
||||
& {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.with-icon::before {
|
||||
font-size: 1.6rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
&.button-primary {
|
||||
background-color: var(--color-white);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
&.bordered {
|
||||
border: 1px solid var(--color-primary);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-primary);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-white);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.button-secondary {
|
||||
background-color: var(--color-white);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-secondary);
|
||||
}
|
||||
|
||||
&.bordered {
|
||||
border: 1px solid var(--color-secondary);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-secondary);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-white);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.button-complementary {
|
||||
color: var(--color-complementary);
|
||||
background-color: var(--color-white);
|
||||
|
||||
&.bordered {
|
||||
border: 1px solid var(--color-complementary);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-complementary);
|
||||
color: var(--color-white);
|
||||
}
|
||||
}
|
||||
|
||||
&.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
&.reversed {
|
||||
&.button-primary {
|
||||
background-color: var(--color-primary);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-white);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-white);
|
||||
color: var(--color-primary);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
&.bordered {
|
||||
border: 1px solid var(--color-primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.button-secondary {
|
||||
background-color: var(--color-secondary);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-white);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-white);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-secondary);
|
||||
}
|
||||
|
||||
&.bordered {
|
||||
border: 1px solid var(--color-secondary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.button-complementary {
|
||||
background-color: var(--color-complementary);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-white);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-white);
|
||||
|
||||
*,
|
||||
& {
|
||||
color: var(--color-complementary);
|
||||
}
|
||||
|
||||
&.bordered {
|
||||
border: 1px solid var(--color-complementary);
|
||||
}
|
||||
|
||||
@ -2,46 +2,37 @@
|
||||
background-color: var(--color-menu-background);
|
||||
color: var(--color-menu-text);
|
||||
/*transition: flex-basis 0.5s ease-in-out;*/
|
||||
|
||||
&.open {
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.unread {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
solid-router {
|
||||
.menu-wrapper {
|
||||
&.is-closed {
|
||||
.sub-menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu-chevron {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
solid-link {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.menu {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
font-weight: bold;
|
||||
padding: 1.2rem;
|
||||
|
||||
&[active] {
|
||||
background-color: var(--color-menu-highlight-primary);
|
||||
|
||||
.menu-icon:before {
|
||||
background-color: var(--color-menu-icon-background-active);
|
||||
}
|
||||
|
||||
.menu-notification>solid-display>div:first-child {
|
||||
background-color: var(--color-menu-badge-background);
|
||||
}
|
||||
@ -51,7 +42,6 @@
|
||||
&[name="events"][active] .menu-icon:before {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
@ -60,7 +50,6 @@
|
||||
flex-shrink: 0;
|
||||
font-size: 1.7rem;
|
||||
width: 3.2em;
|
||||
|
||||
&:before {
|
||||
border-radius: 100%;
|
||||
height: 1.9em;
|
||||
@ -68,7 +57,6 @@
|
||||
width: 1.9em;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -80,7 +68,6 @@
|
||||
text-transform: uppercase;
|
||||
width: 8em;
|
||||
}
|
||||
|
||||
.menu-chevron {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
@ -89,40 +76,34 @@
|
||||
justify-content: center;
|
||||
width: 2em;
|
||||
}
|
||||
|
||||
>solid-display {
|
||||
display: block;
|
||||
}
|
||||
&[name="events"], &[name="resources"] {
|
||||
&[name="events"],
|
||||
&[name="resources"],
|
||||
&[name="polls"] {
|
||||
.menu-label {
|
||||
width: 9.9em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sub-menu {
|
||||
|
||||
/* Ellipsis for project tab */
|
||||
|
||||
.project-tab>div>solid-display>div:nth-child(1) {
|
||||
|
||||
solid-set-default[name='project'] {
|
||||
flex: 3;
|
||||
|
||||
.project-customer,
|
||||
.project-name {
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
width: calc(80vw - 96px); /*96px = padding of the element + width and margin of counter */
|
||||
|
||||
width: calc(80vw - 96px);
|
||||
/*96px = padding of the element + width and margin of counter */
|
||||
@include breakpoint(lg) {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
.project-customer,
|
||||
.project-name>div {
|
||||
|
||||
@include breakpoint(lg) {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
@ -132,19 +113,15 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Ellipsis for circle tab */
|
||||
|
||||
.circle-tab>div>solid-display>div {
|
||||
|
||||
solid-display-div[name='name'] {
|
||||
flex: 3;
|
||||
|
||||
>div[name='name'] {
|
||||
box-sizing: border-box;
|
||||
padding-left: 0.2em;
|
||||
width: calc(80vw - 96px); /*96px = padding of the element + width and margin of counter */
|
||||
|
||||
width: calc(80vw - 96px);
|
||||
/*96px = padding of the element + width and margin of counter */
|
||||
@include breakpoint(lg) {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@ -154,18 +131,15 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Ellipsis for message tab */
|
||||
|
||||
.message-tab>div>solid-display>div>solid-display-div>div {
|
||||
box-sizing: border-box;
|
||||
width: calc(80vw - 96px); /*96px = padding of the element + width and margin of counter */
|
||||
|
||||
width: calc(80vw - 96px);
|
||||
/*96px = padding of the element + width and margin of counter */
|
||||
@include breakpoint(lg) {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
solid-display.nosub>solid-form[fields="name"]>hubl-search-users>input {
|
||||
margin-left: 30px;
|
||||
margin-bottom: 10px;
|
||||
@ -176,42 +150,34 @@
|
||||
border: 1px solid var(--color-grey-4);
|
||||
border-radius: 3px;
|
||||
padding: 4px;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
margin: auto;
|
||||
margin-bottom: 10px;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
solid-display.nosub>nav {
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
display: grid;
|
||||
grid-template-columns: auto 50% auto;
|
||||
grid-template-areas: "left middle right";
|
||||
|
||||
>* {
|
||||
color: var(--color-grey-6);
|
||||
}
|
||||
|
||||
>[data-id="prev"] {
|
||||
grid-area: left;
|
||||
}
|
||||
|
||||
>[data-id="next"] {
|
||||
grid-area: right;
|
||||
}
|
||||
|
||||
>span {
|
||||
grid-area: middle;
|
||||
}
|
||||
}
|
||||
|
||||
hubl-menu-publicprivate {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
|
||||
div {
|
||||
font-family: simple-line-icons;
|
||||
width: 20px;
|
||||
@ -219,38 +185,30 @@
|
||||
padding-top: 0.1em;
|
||||
}
|
||||
}
|
||||
|
||||
>solid-display.nosub>div>solid-display>div {
|
||||
padding: 1rem 1rem 1rem 3rem;
|
||||
}
|
||||
|
||||
solid-display>div {
|
||||
|
||||
.create {
|
||||
color: var(--color-white);
|
||||
margin: 1rem 1rem 2.2rem 3.2rem;
|
||||
}
|
||||
|
||||
&>solid-display {
|
||||
&:last-child>div {
|
||||
margin-bottom: 2.2rem;
|
||||
}
|
||||
|
||||
>div {
|
||||
color: var(--color-grey-6);
|
||||
cursor: pointer;
|
||||
|
||||
>hubl-menu-fix-url-circle>solid-display>div,
|
||||
>hubl-menu-fix-url-project>solid-display>div {
|
||||
padding: 1rem 1rem 1rem 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
&[fields="project(customer.name, name), badge"]>div {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&>solid-display[active]>div,
|
||||
&>solid-display>div>hubl-menu-fix-url-circle>solid-display[active]>div,
|
||||
&>solid-display>div>hubl-menu-fix-url-project>solid-display[active]>div {
|
||||
@ -259,26 +217,21 @@
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
&.menu-notification {
|
||||
|
||||
>solid-display>div>solid-display>div>hubl-menu-fix-url-circle,
|
||||
>solid-display>div>solid-display>div>hubl-menu-fix-url-project {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
>solid-display>div>solid-display>div,
|
||||
>solid-display>div>solid-display>div>hubl-menu-fix-url-circle>solid-display>div,
|
||||
>solid-display>div>solid-display>div>hubl-menu-fix-url-project>solid-display>div {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
hubl-counter {
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
margin-right: 1em;
|
||||
|
||||
div.counter:not([data-nb-unread="0"]) {
|
||||
text-align: center;
|
||||
display: block;
|
||||
@ -294,7 +247,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.divider {
|
||||
height: 1px;
|
||||
background-color: var(--color-grey-11);
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
#events, #circle-events {
|
||||
#events,
|
||||
#circle-events {
|
||||
width: 100%;
|
||||
font-family: "Facit";
|
||||
font-weight: 400;
|
||||
@ -16,7 +17,8 @@
|
||||
.event-place-name {
|
||||
font-weight: 700;
|
||||
}
|
||||
#listevents, #circle-listevents {
|
||||
#listevents,
|
||||
#circle-listevents {
|
||||
[name="name"],
|
||||
solid-display-link-event .mdi::before {
|
||||
color: #C4262E;
|
||||
@ -46,7 +48,7 @@
|
||||
padding: 5px 20px;
|
||||
color: #063B5C;
|
||||
}
|
||||
solid-form solid-form-dropdown{
|
||||
sib-form sib-form-dropdown {
|
||||
label div {
|
||||
height: 2.5rem;
|
||||
}
|
||||
@ -80,15 +82,26 @@
|
||||
}
|
||||
}
|
||||
#eventdetail {
|
||||
.mdi::before {
|
||||
margin: 0 5px 0 20px;
|
||||
}
|
||||
[name="infotext"] {
|
||||
text-align: left;
|
||||
}
|
||||
[name="name"] {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 3.2rem;
|
||||
line-height: 3.8rem;
|
||||
color: #063B5C;
|
||||
}
|
||||
color: #063B5C;
|
||||
solid-display div .event-type {
|
||||
.event-type {
|
||||
width: max-content;
|
||||
padding: 5px 20px;
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.3rem;
|
||||
height: 13px;
|
||||
margin: 10px 20px;
|
||||
}
|
||||
[name="longDescription"] p {
|
||||
font-size: 1.6rem;
|
||||
@ -111,6 +124,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.with-sidebar nav>solid-router>ul [name="circle-events"] {
|
||||
li::before {
|
||||
content: '';
|
||||
|
||||
@ -6,6 +6,12 @@
|
||||
#pollListing {
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
.headline h2 {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 2.4rem;
|
||||
line-height: 3.8rem;
|
||||
color: #063B5C;
|
||||
}
|
||||
.all-polls {
|
||||
/*make 3 polls per line*/
|
||||
div:first-of-type {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
width: 100%;
|
||||
font-family: "Facit";
|
||||
font-weight: 400;
|
||||
color: #3A3A3A;
|
||||
color: #7A7F85;
|
||||
solid-resource {
|
||||
background-color: #F0F3F6;
|
||||
.sib-resource {
|
||||
@ -23,9 +23,31 @@
|
||||
.lnk-newresource {
|
||||
margin-top: 30px;
|
||||
margin-right: 70px;
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
}
|
||||
.resources sib-form::before {
|
||||
#listresources .lnk-newkeyword {
|
||||
top: 133px;
|
||||
left: 220px;
|
||||
.button.thin-button.mdi {
|
||||
padding: 5px 20px;
|
||||
}
|
||||
}
|
||||
.resources {
|
||||
margin-top: -35px;
|
||||
sib-form {
|
||||
&::before {
|
||||
content: "Research a resource";
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
color: #063B5C;
|
||||
font-size: 2.4rem;
|
||||
line-height: 3.8rem;
|
||||
top: -10px;
|
||||
}
|
||||
select {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
}
|
||||
#listresources {
|
||||
.lnk-newkeyword .button {
|
||||
@ -49,6 +71,30 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
#resourcedetail {
|
||||
[name="name"] {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 3.2rem;
|
||||
line-height: 3.8rem;
|
||||
color: #063B5C;
|
||||
}
|
||||
[name="infotext"] {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.event-type {
|
||||
width: max-content;
|
||||
padding: 5px 20px;
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.3rem;
|
||||
height: 13px;
|
||||
margin: 0 20px 10px;
|
||||
background-color: #C4262E;
|
||||
color: white;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
border-radius: 15px;
|
||||
}
|
||||
}
|
||||
.resource-tag {
|
||||
font-family: Facilt;
|
||||
font-weight: 600;
|
||||
@ -61,6 +107,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.with-sidebar nav>solid-router>ul [name="circle-resources"] {
|
||||
li::before {
|
||||
content: '';
|
||||
|
||||
Loading…
Reference in New Issue
Block a user