notifications menu container styles moved

This commit is contained in:
svetlagasheva 2019-10-16 17:08:21 +03:00
parent 9b2b97cb86
commit 2cc1cb1e56

View file

@ -18,51 +18,51 @@
height: 50%;
fill: var(--color-surfacelighter);
}
}
.notifications-menu-container {
display: flex;
flex-direction: column;
.notifications-bar {
.notifications-menu-container {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0.5rem;
border-bottom: thin solid var(--color-surfacelight);
background-color: var(--color-surfacelighter);
.notifications-label {
padding-left: 0.5rem;
color: var(--color-surfacedark);
}
.button-container {
width: 2rem;
height: 2rem;
flex-direction: column;
.notifications-bar {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
&:hover, &:focus {
background-color: var(--color-surfacelight);
justify-content: space-between;
padding: 0.5rem;
border-bottom: thin solid var(--color-surfacelight);
background-color: var(--color-surfacelighter);
.notifications-label {
padding-left: 0.5rem;
color: var(--color-surfacedark);
}
.icon {
width: 1.2rem;
fill: var(--color-surfacedark);
.button-container {
width: 2rem;
height: 2rem;
display: flex;
align-items: center;
justify-content: center;
&:hover, &:focus {
background-color: var(--color-surfacelight);
}
.icon {
width: 1.2rem;
fill: var(--color-surfacedark);
}
}
}
.notifications-list {
--item-size: 28rem;
flex-grow: 0;
flex-shrink: 0;
flex-basis: auto;
height: 30rem;
align-self: stretch;
}
}
.notifications-list {
--item-size: 28rem;
flex-grow: 0;
flex-shrink: 0;
flex-basis: auto;
height: 30rem;
align-self: stretch;
}
}
}