Merge branch 'master' of https://git.startinblox.com/applications/hubl into feature/resource-component
This commit is contained in:
Marjolaine Le Bon
@ -102,6 +102,8 @@
|
||||
--color-select-list: var(--color-secondary);
|
||||
--color-select-add-button: var(--color-button-secondary);
|
||||
--color-select-add-button-background: var(--color-button-white);
|
||||
--color-add-button-background: var(--color-button-secondary);
|
||||
--color-add-button: var(--color-white);
|
||||
|
||||
--color-label-light: var(--color-grey-6);
|
||||
|
||||
|
||||
@ -1,6 +1,4 @@
|
||||
#about{
|
||||
$main-color: rgb(236, 94, 92);
|
||||
$second-color: white;
|
||||
h2,h3{
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@ -37,10 +35,10 @@
|
||||
}
|
||||
|
||||
.main-cta{
|
||||
background: $second-color none repeat scroll 0% 0%;
|
||||
border: 1px solid $main-color;
|
||||
background: var(--color-white) none repeat scroll 0% 0%;
|
||||
border: 1px solid var(--color-primary);
|
||||
border-radius: 55px;
|
||||
color: $main-color;
|
||||
color: var(--color-primary);
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
@ -51,8 +49,8 @@
|
||||
}
|
||||
|
||||
.main-cta:hover{
|
||||
background: $main-color none repeat scroll 0% 0%;
|
||||
border : 1px solid $second-color;
|
||||
color: $second-color;
|
||||
background: var(--color-primary) none repeat scroll 0% 0%;
|
||||
border : 1px solid var(--color-primary);
|
||||
color: var(--color-white);
|
||||
}
|
||||
}
|
||||
@ -1,3 +1,9 @@
|
||||
solid-form {
|
||||
[data-id="error"] {
|
||||
display: none !important; // Hide the default core message, english only with a weird message
|
||||
}
|
||||
}
|
||||
|
||||
.form form {
|
||||
display: block;
|
||||
height: fit-content;
|
||||
@ -41,16 +47,14 @@
|
||||
.form-label {
|
||||
/*flex: 1 1 auto;*/
|
||||
|
||||
label {
|
||||
display: flex;
|
||||
flex-direction: column; /* To align label and input vertically */
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.8rem;
|
||||
margin-top: 1.8rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
display: flex;
|
||||
flex-direction: column; /* To align label and input vertically */
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.8rem;
|
||||
margin-top: 1.8rem;
|
||||
text-transform: uppercase;
|
||||
|
||||
&.is-light label {
|
||||
&.is-light {
|
||||
color: var(--color-label-light);
|
||||
}
|
||||
}
|
||||
@ -130,11 +134,14 @@ textarea {
|
||||
|
||||
/* WIDGETS SIB (let in .content-box to override default styles) */
|
||||
|
||||
solid-form-auto-completion,
|
||||
solid-form-dropdown-autocompletion,
|
||||
solid-form-dropdown-autocompletion-label,
|
||||
solid-form-multipleselect-autocompletion-label,
|
||||
hubl-status {
|
||||
|
||||
.ss-main {
|
||||
font-weight: normal;
|
||||
margin-top: 0.8rem;
|
||||
text-transform: none;
|
||||
|
||||
|
||||
@ -144,7 +151,6 @@ hubl-status {
|
||||
border-radius: 0px;
|
||||
color: var(--color-input-text);
|
||||
font-weight: normal;
|
||||
margin-top: 0.8rem;
|
||||
min-height: 4.6rem;
|
||||
padding-left: 1.2rem;
|
||||
|
||||
@ -179,6 +185,7 @@ hubl-status {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 2.6rem;
|
||||
margin-top: 1.8rem;
|
||||
}
|
||||
|
||||
label {
|
||||
@ -199,6 +206,7 @@ hubl-status {
|
||||
width: 100%;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
height: 32px;
|
||||
margin: auto 0 auto 2.2rem;
|
||||
width: auto;
|
||||
}
|
||||
@ -288,13 +296,13 @@ solid-form-file {
|
||||
}
|
||||
}
|
||||
|
||||
/*solid-multiple-select {
|
||||
/*solid-form-multipleselect {
|
||||
|
||||
&.select-skills .ss-values .ss-disabled::before {
|
||||
content: "Select skills";
|
||||
}
|
||||
|
||||
solid-form-auto-completion > label {
|
||||
solid-form-dropdown-autocompletion-label > label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@ -378,7 +386,8 @@ hubl-member-form {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
solid-form-auto-completion {
|
||||
solid-form-dropdown-autocompletion-label,
|
||||
solid-form-multipleselect-autocompletion-label {
|
||||
float: left;
|
||||
}
|
||||
|
||||
|
||||
@ -26,6 +26,34 @@
|
||||
}
|
||||
}
|
||||
|
||||
.header-left {
|
||||
flex-grow: 1;
|
||||
position: relative;
|
||||
|
||||
.logo {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.beta-tag {
|
||||
display: none;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
display: inline-block;
|
||||
font-size: 1.4rem;
|
||||
font-weight: 600;
|
||||
line-height: 19px;
|
||||
letter-spacing: 0.19px;
|
||||
padding: 3px 13px 3px 15px;
|
||||
border-radius: 3px;
|
||||
background: var(--color-primary);
|
||||
color: var(--color-white);
|
||||
position: fixed;
|
||||
top: 12px;
|
||||
left: 267px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
>*:not(:first-child) {
|
||||
margin-left: 2rem;
|
||||
|
||||
@ -34,15 +62,15 @@
|
||||
}
|
||||
}
|
||||
|
||||
.logo {
|
||||
flex: 1 0 0;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
/* To remove the place taken by this element */
|
||||
/* Fix: to remove the place taken by these elements */
|
||||
solid-widget[name='hubl-user-avatar'] {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
solid-notifications-template[data-rdf-type='hd:circle'],
|
||||
solid-notifications-template[data-rdf-type='foaf:user'] {
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
/* General styling for both notification and user's panel */
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,263 +1,302 @@
|
||||
#main__menu {
|
||||
background-color: var(--color-menu-background);
|
||||
color: var(--color-menu-text);
|
||||
/*transition: flex-basis 0.5s ease-in-out;*/
|
||||
&.open {
|
||||
transform: translateX(0);
|
||||
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 {
|
||||
.menu-icon.icon-arrow-up {
|
||||
visibility: hidden;
|
||||
}
|
||||
@include breakpoint(lg) {
|
||||
.menu-icon.icon-arrow-up {
|
||||
visibility: visible;
|
||||
}
|
||||
&.is-closed {
|
||||
.sub-menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.menu-chevron {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.unread {
|
||||
font-weight: bolder;
|
||||
|
||||
solid-link {
|
||||
width: 100%;
|
||||
}
|
||||
solid-router {
|
||||
.menu-wrapper {
|
||||
&.is-closed {
|
||||
.sub-menu {
|
||||
display: none;
|
||||
}
|
||||
.menu-chevron {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.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);
|
||||
}
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
font-size: 1.7rem;
|
||||
width: 3.2em;
|
||||
|
||||
&:before {
|
||||
border-radius: 100%;
|
||||
height: 1.9em;
|
||||
line-height: 1.9em;
|
||||
width: 1.9em;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-grow: 1;
|
||||
flex-shrink: 0;
|
||||
font-weight: 600;
|
||||
justify-content: center;
|
||||
letter-spacing: 0.017rem;
|
||||
text-transform: uppercase;
|
||||
width: 8em;
|
||||
}
|
||||
|
||||
.menu-chevron {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
justify-content: center;
|
||||
width: 2em;
|
||||
}
|
||||
|
||||
>solid-display {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.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 */
|
||||
|
||||
@include breakpoint(lg) {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
.project-customer,
|
||||
.project-name>div {
|
||||
|
||||
@include breakpoint(lg) {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
solid-link {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 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 */
|
||||
|
||||
@include breakpoint(lg) {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.menu {
|
||||
}
|
||||
|
||||
/* 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 */
|
||||
|
||||
@include breakpoint(lg) {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
solid-display.nosub>solid-form[fields="name"]>hubl-search-users>input {
|
||||
margin-left: 30px;
|
||||
margin-bottom: 10px;
|
||||
width: calc(80vw - 71px);
|
||||
display: block;
|
||||
background-color: var(--color-secondary);
|
||||
color: var(--color-white);
|
||||
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-white);
|
||||
}
|
||||
|
||||
>[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;
|
||||
font-size: 0.8em;
|
||||
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-white);
|
||||
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);
|
||||
}
|
||||
}
|
||||
&[name="dashboard"][active] .menu-icon:before,
|
||||
&[name="members"][active] .menu-icon:before,
|
||||
&[name="resources"][active] .menu-icon:before,
|
||||
&[name="polls"][active] .menu-icon:before,
|
||||
&[name="events"][active] .menu-icon:before {
|
||||
background-color: transparent;
|
||||
}
|
||||
.menu-icon {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
font-size: 1.7rem;
|
||||
width: 3.2em;
|
||||
&:before {
|
||||
border-radius: 100%;
|
||||
height: 1.9em;
|
||||
line-height: 1.9em;
|
||||
width: 1.9em;
|
||||
}
|
||||
}
|
||||
.menu-label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-grow: 1;
|
||||
flex-shrink: 0;
|
||||
font-weight: 600;
|
||||
justify-content: center;
|
||||
letter-spacing: 0.017rem;
|
||||
text-transform: uppercase;
|
||||
width: 8em;
|
||||
}
|
||||
.menu-chevron {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
justify-content: center;
|
||||
width: 2em;
|
||||
}
|
||||
>solid-display {
|
||||
display: block;
|
||||
}
|
||||
&[name="events"],
|
||||
&[name="resources"],
|
||||
&[name="polls"],
|
||||
&[name="dashboard"],
|
||||
&[name="members"] {
|
||||
.menu-label {
|
||||
width: 9.9em;
|
||||
}
|
||||
|
||||
>hubl-menu-fix-url-circle>solid-link>solid-display>div,
|
||||
>hubl-menu-fix-url-project>solid-link>solid-display>div {
|
||||
padding: 1rem 1rem 1rem 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
&[fields="project(customer.name, name), badge"]>div {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.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 */
|
||||
@include breakpoint(lg) {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
.project-customer,
|
||||
.project-name>div {
|
||||
@include breakpoint(lg) {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 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 */
|
||||
@include breakpoint(lg) {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 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 */
|
||||
@include breakpoint(lg) {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
solid-display.nosub>solid-form[fields="name"]>hubl-search-users>input {
|
||||
margin-left: 30px!important;
|
||||
margin-bottom: 10px;
|
||||
width: calc(80vw - 71px);
|
||||
display: block;
|
||||
background-color: var(--color-secondary);
|
||||
color: var(--color-grey-6);
|
||||
border: 1px solid var(--color-grey-4);
|
||||
border-radius: 3px;
|
||||
padding: 4px;
|
||||
@include breakpoint(lg) {
|
||||
margin: auto;
|
||||
margin-bottom: 10px;
|
||||
width: auto;
|
||||
&::placeholder {
|
||||
color: var(--color-grey-6);
|
||||
}
|
||||
}
|
||||
}
|
||||
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;
|
||||
font-size: 0.8em;
|
||||
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 {
|
||||
background-color: var(--color-menu-highlight-primary);
|
||||
color: var(--color-menu-text-active);
|
||||
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;
|
||||
background-color: var(--sib-notifications-theme, gray);
|
||||
border-radius: 50%;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
padding-bottom: 0;
|
||||
color: var(--color-secondary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&>solid-display[active]>div,
|
||||
&>solid-display>div>hubl-menu-fix-url-circle>solid-link>solid-display[active]>div,
|
||||
&>solid-display>div>hubl-menu-fix-url-project>solid-link>solid-display[active]>div {
|
||||
background-color: var(--color-menu-highlight-primary);
|
||||
color: var(--color-menu-text-active);
|
||||
font-weight: bold;
|
||||
}
|
||||
.divider {
|
||||
height: 1px;
|
||||
background-color: var(--color-grey-11);
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
&.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-link>solid-display>div,
|
||||
>solid-display>div>solid-display>div>hubl-menu-fix-url-project>solid-link>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;
|
||||
background-color: var(--sib-notifications-theme, gray);
|
||||
border-radius: 50%;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
padding-bottom: 0;
|
||||
color: var(--color-secondary);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.divider {
|
||||
height: 1px;
|
||||
background-color: var(--color-grey-11);
|
||||
opacity: 0.2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -46,13 +46,17 @@
|
||||
&>* {
|
||||
border-bottom: 1px solid var(--color-table-border);
|
||||
display: table-cell;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
solid-multiple[name="user.communities"] {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&>solid-multiple {
|
||||
display: contents;
|
||||
/*&>solid-multiple {
|
||||
display: contents;*/
|
||||
|
||||
&>div {
|
||||
display: contents;
|
||||
@ -68,7 +72,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/*}*/
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -117,6 +121,14 @@
|
||||
width: 280px;
|
||||
}
|
||||
|
||||
.w450 {
|
||||
width: 450px;
|
||||
}
|
||||
|
||||
.w370 {
|
||||
width: 370px;
|
||||
}
|
||||
|
||||
.w230 {
|
||||
width: 230px;
|
||||
}
|
||||
@ -152,6 +164,10 @@
|
||||
.desktop-btn-margin__left;
|
||||
}
|
||||
}
|
||||
|
||||
&.is-spaced {
|
||||
padding: 0.8rem 2.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.cell-with-name {
|
||||
@ -163,23 +179,11 @@
|
||||
|
||||
/* Styles of elements inside cells */
|
||||
|
||||
.user-thumb>div,
|
||||
[name='user-thumb'] {
|
||||
vertical-align: middle;
|
||||
text-align: left;
|
||||
@extend %user-thumb__grid;
|
||||
padding: 0 2.2rem;
|
||||
|
||||
>.user-thumb__picture {
|
||||
@extend .user-thumb__picture;
|
||||
}
|
||||
|
||||
>[name='sup'] {
|
||||
@extend %user-thumb__grid-sup;
|
||||
}
|
||||
|
||||
>[name='sub'] {
|
||||
@extend %user-thumb__grid-inf;
|
||||
.table {
|
||||
|
||||
.user-thumb.is-spaced,
|
||||
[name='user-thumb'] {
|
||||
padding: 0.8rem 2.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -35,6 +35,22 @@
|
||||
color: var(--color-user-thumb-name);
|
||||
font-weight: 600;
|
||||
margin-right: 1rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.user-thumb__send {
|
||||
position: relative;
|
||||
bottom: 7px;
|
||||
left: -5px;
|
||||
|
||||
solid-link {
|
||||
@include icon('speech');
|
||||
|
||||
&::before {
|
||||
display: inline-block;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-thumb__admin:not(:empty) {
|
||||
@ -50,8 +66,33 @@
|
||||
content: '@';
|
||||
}
|
||||
}
|
||||
solid-multiple[name="user.communities"] {
|
||||
* {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
solid-display-value {
|
||||
&:after {
|
||||
content: ",";
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
display: inline-block!important;
|
||||
}
|
||||
|
||||
>solid-display>div>solid-display:last-child>div>solid-display-value:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
>solid-display {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: calc(50% - 22px - 0.5rem);
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
.user-thumb__city:not(:empty) {
|
||||
@include mdi('atom');
|
||||
align-items: center;
|
||||
display: flex;
|
||||
@ -76,10 +117,16 @@
|
||||
margin-right: 0.50rem;
|
||||
}
|
||||
}
|
||||
.user-thumb[name="classGroup"] {
|
||||
display: block;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
/* Apply the grids to all user-thumbs */
|
||||
.user-thumb>div,
|
||||
.user-thumb>[name='classGrid'],
|
||||
[name='user-thumb'] {
|
||||
|
||||
@extend %user-thumb__grid;
|
||||
|
||||
>[name='sup'] {
|
||||
@ -90,9 +137,3 @@
|
||||
@extend %user-thumb__grid-inf;
|
||||
}
|
||||
}
|
||||
|
||||
/* Add extra spaces to user-thumbs that are inside a table */
|
||||
.user-thumb.is-spaced>div,
|
||||
[name='user-thumb'] {
|
||||
padding: 0.8rem 2.2rem;
|
||||
}
|
||||
|
||||
@ -37,9 +37,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
solid-conversation.conversation {
|
||||
sib-conversation.conversation {
|
||||
|
||||
.solid-conversation {
|
||||
.sib-conversation {
|
||||
font-family: Open Sans;
|
||||
|
||||
[name='conversation-wrapper'] {
|
||||
@ -74,7 +74,7 @@
|
||||
solid-ac-checker {
|
||||
border-top: 1px solid $color-210-17-91;
|
||||
|
||||
solid-form-textarea {
|
||||
solid-form-textarea-label {
|
||||
|
||||
>label div {
|
||||
color: $color-210-5-56;
|
||||
|
||||
@ -8,6 +8,10 @@
|
||||
|
||||
&.with-padding {
|
||||
padding: 1.3rem;
|
||||
|
||||
@include breakpoint(lg) {
|
||||
padding: 2.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -82,7 +86,8 @@
|
||||
>solid-route {
|
||||
|
||||
&[name*='circle'],
|
||||
&[name*='project'] {
|
||||
&[name*='project'],
|
||||
&[name*='communities'] {
|
||||
|
||||
>li::before {
|
||||
font-size: 4rem;
|
||||
@ -116,16 +121,8 @@
|
||||
@include ci('file');
|
||||
}
|
||||
|
||||
&[name='admin-users']>li::before {
|
||||
background-color: var(--color-secondary);
|
||||
content: '';
|
||||
display: inline-block;
|
||||
height: 40px;
|
||||
mask: url('/images/add-user.svg') 1% 1% / 1px 1px no-repeat;
|
||||
mask-size: cover;
|
||||
-webkit-mask: url('/images/add-user.svg') 1% 1% / 1px 1px no-repeat;
|
||||
-webkit-mask-size: cover;
|
||||
width: 40px;
|
||||
&[name='admin-communities']>li {
|
||||
@include ci('networking');
|
||||
}
|
||||
|
||||
&[name='admin-circles']>li {
|
||||
|
||||
@ -26,4 +26,3 @@
|
||||
@import 'layout/dashboard/index';
|
||||
@import 'layout/polls/index';
|
||||
}
|
||||
@import '../../client.sample.etuc.scss';
|
||||
|
||||
@ -7,20 +7,20 @@ solid-event section {
|
||||
width: 100%;
|
||||
font-family: "Facit";
|
||||
font-weight: 400;
|
||||
color: #7A7F85;
|
||||
color: var(--color-main-text);
|
||||
solid-event {
|
||||
sib-display div {
|
||||
solid-display div {
|
||||
max-width: 1110px;
|
||||
sib-display {
|
||||
solid-display {
|
||||
margin: 0 0 20px 40px;
|
||||
}
|
||||
}
|
||||
.red-button,
|
||||
.event-type {
|
||||
background-color: #C4262E;
|
||||
background-color: var(--color-add-button-background);
|
||||
}
|
||||
.black-button {
|
||||
background-color: #3A3A3A;
|
||||
background-color: var(--highlight-font-color);
|
||||
margin-left: 10%;
|
||||
}
|
||||
.event-type,
|
||||
@ -30,23 +30,23 @@ solid-event section {
|
||||
#listevents,
|
||||
#circle-listevents {
|
||||
[name="name"],
|
||||
solid-display-link-event .mdi::before {
|
||||
color: #063B5C;
|
||||
event-display-link-event .mdi::before {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
.event-place-name,
|
||||
.nextevent-startdate,
|
||||
solid-display-link-event {
|
||||
color: #3A3A3A;
|
||||
event-display-link-event {
|
||||
color: var(--highlight-font-color);
|
||||
}
|
||||
.sib-event {
|
||||
.solid-event {
|
||||
font-family: "Facit";
|
||||
font-weight: 400;
|
||||
.page-title {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 3.2rem;
|
||||
line-height: 3.8rem;
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
}
|
||||
#default-listevents,
|
||||
@ -56,22 +56,21 @@ solid-event section {
|
||||
width: max-content;
|
||||
height: max-content;
|
||||
padding: 5px 20px;
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
sib-form {
|
||||
sib-form-dropdown {
|
||||
margin-left: 15px;
|
||||
label div {
|
||||
.headline h2 {
|
||||
float: left;
|
||||
margin-top: 35px;
|
||||
color: var(--color-primary);
|
||||
text-transform: none;
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 2.4rem;
|
||||
}
|
||||
solid-form {
|
||||
solid-form-dropdown-label {
|
||||
label {
|
||||
height: 2.5rem;
|
||||
}
|
||||
&::before {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 2.4rem;
|
||||
line-height: 29px;
|
||||
color: #063B5C;
|
||||
top: -40px;
|
||||
content: "Research an event";
|
||||
}
|
||||
}
|
||||
}
|
||||
[name="name"] {
|
||||
@ -79,7 +78,7 @@ solid-event section {
|
||||
font-size: 1.8rem;
|
||||
line-height: 2.6rem;
|
||||
letter-spacing: 0.32px;
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
padding: 5px;
|
||||
max-width: 250px;
|
||||
margin: 5px auto;
|
||||
@ -90,12 +89,12 @@ solid-event section {
|
||||
width: max-content;
|
||||
height: max-content;
|
||||
}
|
||||
solid-display-location-events {
|
||||
event-display-location-events {
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
.eventdetail {
|
||||
sib-display div {
|
||||
solid-display div {
|
||||
display: block;
|
||||
}
|
||||
.mdi::before {
|
||||
@ -108,10 +107,10 @@ solid-event section {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 3.2rem;
|
||||
line-height: 3.8rem;
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
display: block;
|
||||
}
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
.event-type {
|
||||
width: max-content;
|
||||
padding: 5px 20px;
|
||||
@ -124,12 +123,12 @@ solid-event section {
|
||||
font-size: 1.6rem;
|
||||
line-height: 2.6rem;
|
||||
}
|
||||
solid-display-link-event a {
|
||||
event-display-link-event a {
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
}
|
||||
.newevent label div,
|
||||
.newevent sib-form-file div label {
|
||||
.newevent solid-form-file-label div label {
|
||||
line-height: 2.2rem;
|
||||
text-transform: uppercase;
|
||||
color: var(--form-title);
|
||||
@ -165,7 +164,7 @@ solid-event section {
|
||||
background-color: #f0f3f6;
|
||||
}
|
||||
|
||||
#circle-events solid-event .events sib-form sib-form-dropdown select {
|
||||
#circle-events solid-event .events solid-form solid-form-dropdown-label select {
|
||||
background-color: #f0f3f6;
|
||||
}
|
||||
|
||||
|
||||
@ -180,7 +180,7 @@ solid-job-board {
|
||||
}
|
||||
}
|
||||
|
||||
.solid-conversation,
|
||||
.sib-conversation,
|
||||
.conversation > div {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
|
||||
@ -1 +1 @@
|
||||
@import '_polls.scss';
|
||||
@import 'polls.scss';
|
||||
@ -12,27 +12,25 @@ solid-poll > div {
|
||||
margin: auto;
|
||||
.headline {
|
||||
h2 {
|
||||
margin: 0 40px;
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 2.4rem;
|
||||
line-height: 3.8rem;
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
float: left;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.add-poll {
|
||||
solid-link {
|
||||
float: right;
|
||||
margin-top: 10px;
|
||||
display: initial;
|
||||
margin-right: 75px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
solid-link {
|
||||
display:flex;
|
||||
justify-content: end;
|
||||
margin-top: 30px;
|
||||
margin-right: 70px;
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
.add-poll {
|
||||
background-color: var(--color-add-button-background);
|
||||
color: var(--color-add-button);
|
||||
box-shadow: 0px 0px 4px 1px #CACACA;
|
||||
height: 2rem;
|
||||
font-size: 1.4rem;
|
||||
text-transform: uppercase;
|
||||
font-weight: 700;
|
||||
padding: 0.55rem 2.5rem;
|
||||
width: max-content;
|
||||
line-height: 20px;
|
||||
&::before {
|
||||
font-family: "material-design-icons";
|
||||
@ -52,9 +50,12 @@ solid-poll > div {
|
||||
display: block;
|
||||
border-bottom: solid 1px #cacaca;
|
||||
height: 90px;
|
||||
width: 650px;
|
||||
margin: 16px 25px 25px;
|
||||
margin: 30px 25px 25px;
|
||||
max-width: 85%;
|
||||
solid-form-dropdown-label label {
|
||||
font-size: 1.4rem;
|
||||
font-family: "Facit";
|
||||
}
|
||||
solid-form-placeholder-text {
|
||||
margin-left: 15px;
|
||||
input {
|
||||
@ -69,7 +70,7 @@ solid-poll > div {
|
||||
height: 100%;
|
||||
max-width: 1100px;
|
||||
margin: auto;
|
||||
solid-display {
|
||||
> solid-display {
|
||||
width: 320px;
|
||||
height: 520px;
|
||||
margin: 0 0 20px 40px;
|
||||
@ -84,7 +85,7 @@ solid-poll > div {
|
||||
*[name="body"] {
|
||||
padding: 10px;
|
||||
/*size of tags of poll card*/
|
||||
etuc-display-votetags {
|
||||
poll-display-votetags {
|
||||
>div {
|
||||
width: 64px;
|
||||
height: 24px;
|
||||
@ -101,7 +102,7 @@ solid-poll > div {
|
||||
}
|
||||
[name="title"] {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
font-size: 1.8rem;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
@ -112,7 +113,7 @@ solid-poll > div {
|
||||
}
|
||||
[name="hostingOrganisation"],
|
||||
[name="endDate"] {
|
||||
color: #3A3A3A;
|
||||
color: var(--highlight-font-color);
|
||||
font-family: Facit;
|
||||
font-size: 14px;
|
||||
letter-spacing: 0;
|
||||
@ -122,7 +123,7 @@ solid-poll > div {
|
||||
&::before {
|
||||
content: '\e037';
|
||||
font-family: 'simple-line-icons';
|
||||
color: #C4262E;
|
||||
color: var(--color-secondary);
|
||||
height: 22px;
|
||||
width: 24px;
|
||||
font-size: 16px;
|
||||
@ -136,11 +137,11 @@ solid-poll > div {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 10px;
|
||||
solid-display-div [name="dateImage"]::before {
|
||||
div [name="dateImage"]::before {
|
||||
display: inline-block;
|
||||
font: normal normal normal 24px/1 "Material Design Icons";
|
||||
content: "\F6AF";
|
||||
color: #C4262E;
|
||||
color: var(--color-secondary);
|
||||
height: 22px;
|
||||
width: 24px;
|
||||
font-size: 20px;
|
||||
@ -149,7 +150,7 @@ solid-poll > div {
|
||||
}
|
||||
}
|
||||
[name="shortDescription"] {
|
||||
color: #7A7F85;
|
||||
color: var(--color-main-text);
|
||||
font-family: Facit;
|
||||
font-size: 14px;
|
||||
letter-spacing: 0;
|
||||
@ -174,6 +175,7 @@ solid-poll > div {
|
||||
h1 {
|
||||
font-size: 3.2rem;
|
||||
line-height: 3.8rem;
|
||||
margin: 20px auto;
|
||||
}
|
||||
h2 {
|
||||
font-size: 26px;
|
||||
@ -186,7 +188,7 @@ solid-poll > div {
|
||||
solid-display.topline {
|
||||
>div:first-of-type {
|
||||
*[name="right"] {
|
||||
etuc-display-votetags {
|
||||
poll-display-votetags {
|
||||
>div {
|
||||
width: 64px;
|
||||
height: 24px;
|
||||
@ -200,15 +202,15 @@ solid-poll > div {
|
||||
}
|
||||
[name="hostingOrganisation"],
|
||||
[name="dateLine"] {
|
||||
color: #3A3A3A;
|
||||
color: var(--highlight-font-color);
|
||||
font-family: Facit;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
[name="dateLine"] solid-set-default {
|
||||
[name="dateLine"] solid-set-default {
|
||||
display: flex;
|
||||
margin-top: 7px;
|
||||
solid-display-date {
|
||||
solid-display-value, solid-display-date-value {
|
||||
margin-left: 7px;
|
||||
}
|
||||
}
|
||||
@ -216,24 +218,24 @@ solid-poll > div {
|
||||
margin-left: 0;
|
||||
[name="hostingOrganisation"]::before {
|
||||
content: '\e037';
|
||||
font-family: 'simple-line-icons';
|
||||
font-family: "simple-line-icons";
|
||||
font-weight: 400;
|
||||
color: #C4262E;
|
||||
color: var(--color-secondary);
|
||||
margin-right: 10px;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
solid-display-div [name="dateImage"]::before {
|
||||
div [name="dateImage"]::before {
|
||||
font-family: "Material Design Icons";
|
||||
font-weight: 400;
|
||||
content: "\F6AF";
|
||||
color: #C4262E;
|
||||
color: var(--color-secondary);
|
||||
font-size: 20px;
|
||||
}
|
||||
[name="shortDescription"],
|
||||
[name="longDescription"] {
|
||||
margin: 20px 0;
|
||||
color: #7A7F85;
|
||||
color: var(--color-main-text);
|
||||
font-family: Facit;
|
||||
}
|
||||
[name="shortDescription"] {
|
||||
@ -255,7 +257,7 @@ solid-poll > div {
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
margin-right: 10px;
|
||||
color: #3A3A3A;
|
||||
color: var(--highlight-font-color);
|
||||
}
|
||||
.vote-section > h3::before {
|
||||
content:"\F004";
|
||||
@ -278,16 +280,15 @@ solid-poll > div {
|
||||
div[name="progressBar"] div .progressBarValue {
|
||||
margin: 0;
|
||||
}
|
||||
#poll-votes-form input[type="submit"] {
|
||||
.poll-votes-form input[type="submit"] {
|
||||
height: 38px;
|
||||
width: 149px;
|
||||
border-radius: 19px;
|
||||
box-shadow: 0 0 7px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
#poll-votes-form input[type="submit"]:disabled {
|
||||
.poll-votes-form input[type="submit"]:disabled {
|
||||
opacity: 0.3;
|
||||
}
|
||||
#unavailablePoll {
|
||||
.unavailablePoll {
|
||||
font-style: italic;
|
||||
}
|
||||
.progressBarValue {
|
||||
@ -297,7 +298,7 @@ solid-poll > div {
|
||||
}
|
||||
.send-share,
|
||||
.back-to-list {
|
||||
background-color: #3A3A3A;
|
||||
background-color: var(--highlight-font-color);
|
||||
padding: 5px 25px;
|
||||
font-size: 1.4rem;
|
||||
&::before {
|
||||
@ -378,9 +379,9 @@ solid-poll > div {
|
||||
background-color: #f0f3f6;;
|
||||
}
|
||||
#circles-add-survey, #default-add-survey {
|
||||
background-color: white;
|
||||
padding: 50px 0;
|
||||
margin: -20px auto;
|
||||
background-color: white;
|
||||
padding: 50px 0;
|
||||
margin: -20px auto;
|
||||
h2 {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 3.2rem;
|
||||
@ -390,7 +391,7 @@ solid-poll > div {
|
||||
}
|
||||
p {
|
||||
margin-top: 10px;
|
||||
color: #7A7F85;
|
||||
color: var(--color-main-text);
|
||||
font-family: Facit;
|
||||
font-size: 16px;
|
||||
}
|
||||
@ -406,12 +407,14 @@ solid-poll > div {
|
||||
height: 110px;
|
||||
}
|
||||
solid-form-label-text,
|
||||
solid-form-textarea {
|
||||
solid-form-textarea,
|
||||
solid-form-label-textarea,
|
||||
solid-form-textarea-label {
|
||||
display: block;
|
||||
margin: 15px 0;
|
||||
padding: 0;
|
||||
}
|
||||
label > div, solid-form-file-image > div label, solid-form-auto-completion[name="tags"] > label::before {
|
||||
label > div, solid-form-file-image > div label, solid-form-dropdown-autocompletion[name="tags"] > label::before {
|
||||
margin-bottom: 5px;
|
||||
margin-top: 20px;
|
||||
color: var(--form-title);
|
||||
@ -451,18 +454,18 @@ solid-poll > div {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
custom-choix {
|
||||
poll-custom-choice {
|
||||
width: calc(100% - 45px);
|
||||
solid-form-label-text[name="name"] {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
button {
|
||||
border: 1px solid var(--main-color);
|
||||
border: 1px solid var(--color-primary);
|
||||
background-color: transparent;
|
||||
border-radius: 15px;
|
||||
font-size: 24px;
|
||||
color: var(--main-color);
|
||||
color: var(--color-primary);
|
||||
padding: 0;
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
@ -480,7 +483,7 @@ solid-poll > div {
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
margin: 10px 0;
|
||||
color: var(--main-color);
|
||||
color: var(--color-primary);
|
||||
&::before {
|
||||
content: "\F419";
|
||||
font-family: Material Design Icons;
|
||||
@ -495,7 +498,7 @@ solid-poll > div {
|
||||
margin-top: 10px;
|
||||
.ss-multi-selected .ss-values .ss-value {
|
||||
border-radius: 14px;
|
||||
background-color: #C4262E;
|
||||
background-color: var(--color-secondary);
|
||||
padding: 5px 10px;
|
||||
font-size: 11px;
|
||||
}
|
||||
@ -510,6 +513,24 @@ solid-poll > div {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
.poll-footer {
|
||||
.back-to-list {
|
||||
background-color: var(--highlight-font-color);
|
||||
padding: 5px 25px;
|
||||
font-size: 1.4rem;
|
||||
margin-left: 10%;
|
||||
border-radius: 15px;
|
||||
color: white;
|
||||
&::before {
|
||||
font-family: "Material Design Icons";
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
vertical-align: middle;
|
||||
color: white;
|
||||
content: "\F04D";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -3,27 +3,27 @@
|
||||
width: 100%;
|
||||
font-family: "Facit";
|
||||
font-weight: 400;
|
||||
color: #7A7F85;
|
||||
color: var(--content-font-color);
|
||||
solid-resource {
|
||||
sib-display div {
|
||||
solid-display div {
|
||||
max-width: 1110px;
|
||||
sib-display {
|
||||
solid-display {
|
||||
margin: 0 0 20px 40px;
|
||||
}
|
||||
}
|
||||
.sib-resource {
|
||||
.solid-resource {
|
||||
font-family: "Facit";
|
||||
.page-title {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 3.2rem;
|
||||
line-height: 3.8rem;
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
.red-button {
|
||||
background-color: #C4262E;
|
||||
background-color: var(--color-add-button-background);
|
||||
}
|
||||
.black-button {
|
||||
background-color: #3A3A3A;
|
||||
background-color: var(--highlight-font-color);
|
||||
margin-left: 10%;
|
||||
}
|
||||
.lnk-newresource {
|
||||
@ -33,23 +33,22 @@
|
||||
position: relative;
|
||||
}
|
||||
.listresources .lnk-newkeyword {
|
||||
top: 133px;
|
||||
top: 155px;
|
||||
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;
|
||||
}
|
||||
.listresources {
|
||||
.headline h2 {
|
||||
float: left;
|
||||
margin-top: 5px;
|
||||
color: var(--color-primary);
|
||||
text-transform: none;
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 2.4rem;
|
||||
}
|
||||
solid-form {
|
||||
select {
|
||||
width: 150px;
|
||||
}
|
||||
@ -61,14 +60,16 @@
|
||||
width: max-content;
|
||||
height: max-content;
|
||||
padding: 10px 30px;
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
sib-display sib-display {
|
||||
solid-display solid-display {
|
||||
[name="name"] {
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
[name="link"] a {
|
||||
[name="link"] a, [name="document"] a {
|
||||
width: 75%;
|
||||
margin-bottom: 10px;
|
||||
padding-left: 35px;
|
||||
position: relative;
|
||||
&::before {
|
||||
@ -84,7 +85,7 @@
|
||||
font-family: "RefrigeratorDelxW01Bold";
|
||||
font-size: 3.2rem;
|
||||
line-height: 3.8rem;
|
||||
color: #063B5C;
|
||||
color: var(--color-primary);
|
||||
}
|
||||
[name="infotext"] {
|
||||
justify-content: flex-start;
|
||||
@ -97,7 +98,7 @@
|
||||
}
|
||||
}
|
||||
.newresource label div,
|
||||
.newresource sib-form-file div label {
|
||||
.newresource solid-form-file div label {
|
||||
line-height: 2.2rem;
|
||||
text-transform: uppercase;
|
||||
color: var(--form-title);
|
||||
@ -108,11 +109,11 @@
|
||||
.newresource select,
|
||||
.newresource textarea,
|
||||
.newresource input,
|
||||
.newresource sib-multiple-select .ss-main .ss-multi-selected {
|
||||
.newresource solid-multiple-select .ss-main .ss-multi-selected {
|
||||
background-color: var(--form-inputs-background);
|
||||
}
|
||||
.newresource input[type="submit"] {
|
||||
background-color: #3C3F57;
|
||||
background-color: var(--form-submit-button);
|
||||
}
|
||||
.newresource input[type="file"] {
|
||||
background-color: transparent;
|
||||
@ -124,7 +125,7 @@
|
||||
}
|
||||
}
|
||||
@media (max-width: 991px) {
|
||||
.sib-resource {
|
||||
.solid-resource {
|
||||
margin-top: 65px;
|
||||
}
|
||||
}
|
||||
@ -134,7 +135,7 @@
|
||||
background-color: #f0f3f6;
|
||||
}
|
||||
|
||||
#circle-resources .resources sib-form sib-form-dropdown select {
|
||||
#circle-resources .resources solid-form solid-form-dropdown select {
|
||||
background-color: #f0f3f6;
|
||||
}
|
||||
|
||||
|
||||
@ -1 +1 @@
|
||||
@import 'user-profile';
|
||||
@import 'messages';
|
||||
|
||||
16
src/styles/layout/user/messages.scss
Normal file
16
src/styles/layout/user/messages.scss
Normal file
@ -0,0 +1,16 @@
|
||||
.avatar-container {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
|
||||
.avatar {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
}
|
||||
}
|
||||
.avatar-text {
|
||||
position: absolute;
|
||||
top: 7.5rem;
|
||||
@include breakpoint(lg) {
|
||||
top: 2.8rem;
|
||||
}
|
||||
}
|
||||
@ -1,76 +0,0 @@
|
||||
/*.user-profile__container {
|
||||
|
||||
.user-bio {
|
||||
display: grid;
|
||||
grid-gap: 1rem;
|
||||
grid-template-areas: "avatar name"
|
||||
"avatar information";
|
||||
grid-template-columns: minmax(300px, 400px) 2fr;
|
||||
|
||||
.avatar-display {
|
||||
grid-area: avatar;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
border-radius: 50%;
|
||||
height: 300px;
|
||||
object-fit: cover;
|
||||
overflow: hidden;
|
||||
object-position: center;
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
.name-diplay {
|
||||
grid-area: name;
|
||||
|
||||
[name='user-name-groups'] {
|
||||
align-items: baseline;
|
||||
align-self: end;
|
||||
display: flex;
|
||||
|
||||
solid-multiple {
|
||||
display: flex;
|
||||
padding-left: 1.4rem;
|
||||
|
||||
hubl-groups-name {
|
||||
@extend %tag-role;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.info-form {
|
||||
grid-area: information; */
|
||||
|
||||
/* ces styles disparaitront lorsque l'on aura la fonctionnalité pour uploader une photo */
|
||||
/*[name="account.picture"] {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
hubl-instruction {
|
||||
margin-left: 1rem;
|
||||
|
||||
span {
|
||||
color: $color-233-18-29;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}*/
|
||||
/* Fin commentaire sur upload photos */
|
||||
/*}
|
||||
|
||||
[name^="inline-"] {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
||||
>*:not(:last-child) {
|
||||
margin-right: 3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}*/
|
||||
Reference in New Issue
Block a user