autonomic-cooperative/hubl
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update: left-menu - search input: positioning and width on small screens

Browse Source
This commit is contained in:
gaelle morin 2020-06-03 14:37:41 +02:00
parent 37a8e28793
commit ec5326887e
No known key found for this signature in database
GPG Key ID: 028426702B95CF9C
1 changed files with 52 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
src/styles/base/menu-left.scss
View File

@ -124,13 +124,20 @@
/* End of specific styles of "Projects" tab */
sib-display.nosub>sib-form[fields="name"]>hubl-search-users>input {
margin: auto;
margin-left: 30px;
max-width: 87%;
width: 87%;
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;
width: auto;
}
}
sib-display.nosub>nav {
@ -256,57 +263,60 @@
}
}
/* Styles for hovering */
/* Styles for hovering (only on large screens) */
#main__menu sib-router .sub-menu.menu-notification>sib-display>div>sib-display>div>hubl-menu-fix-url-project>sib-display>div:hover,
#main__menu sib-router .sub-menu.menu-notification>sib-display>div>sib-display>div>hubl-menu-fix-url-circle>sib-display>div:hover,
#main__menu sib-router .sub-menu.menu-notification>sib-display.nosub>div>sib-display>div:hover {
background-color: var(--color-secondary);
color: var(--color-white);
display: block;
box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.26);
opacity: 70%;
width: 250px;
box-sizing: border-box;
font-weight: normal;
>hubl-menu-publicprivate {
display: none;
}
>hubl-counter {
display: none;
}
/* Hover for projects */
>sib-set-default[name='project']>.project-customer {
@include breakpoint(lg) {
background-color: var(--color-secondary);
color: var(--color-white);
display: block;
box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.26);
opacity: 70%;
width: 250px;
white-space: break-spaces;
text-align: left;
box-sizing: border-box;
font-weight: normal;
}
sib-set-default[name='project']>.project-name {
padding-left: 0;
width: 100%;
&>div {
>hubl-menu-publicprivate {
display: none;
}
>hubl-counter {
display: none;
}
/* Hover for projects */
>sib-set-default[name='project']>.project-customer {
width: 250px;
white-space: break-spaces;
text-align: left;
font-weight: normal;
}
}
/* Hover for circles */
>sib-display-div[name="name"] {
padding-left: 0;
width: 100%;
}
sib-set-default[name='project']>.project-name {
padding-left: 0;
width: 100%;
/* Hover for private messages */
sib-display-div {
&>div {
white-space: break-spaces;
text-align: left;
}
}
>div[name="name"] {
white-space: normal;
/* Hover for circles */
>sib-display-div[name="name"] {
padding-left: 0;
width: 100%;
}
/* Hover for private messages */
sib-display-div {
>div[name="name"] {
white-space: normal;
}
}
}
}