feature: notification - top triangle ok on desktop
This commit is contained in:
parent
7cfea37b1e
commit
897dc336c2
@ -11,7 +11,7 @@ script(type="module" src="https://unpkg.com/@startinblox/oidc@0.9" defer)
|
||||
script(type="module" src="https://unpkg.com/@startinblox/router@0.8" defer)
|
||||
//- script(type="module" src="/lib/solid-router/src/index.js" defer)
|
||||
|
||||
script(type="module" src="https://unpkg.com/@startinblox/component-notifications@0.5.0-beta.2" defer)
|
||||
script(type="module" src="https://unpkg.com/@startinblox/component-notifications@0.5.0-beta.3" defer)
|
||||
//- script(type="module" src="/lib/sib-notifications/index.js" defer)
|
||||
|
||||
if endpoints.events || (endpoints.get && endpoints.get.events)
|
||||
|
@ -108,6 +108,39 @@ solid-notifications {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.solid-notifications__triangle-back {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.solid-notifications__triangle-shadow {
|
||||
position: absolute;
|
||||
left: auto;
|
||||
right: -2.1em;
|
||||
top: 5em;
|
||||
height: 1rem;
|
||||
background: white;
|
||||
|
||||
width: 0;
|
||||
transform: initial;
|
||||
|
||||
z-index: 4;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
margin-left: -5em;
|
||||
top: 0px;
|
||||
left: 50%;
|
||||
border: 1em solid black;
|
||||
border-color: #fff #fff transparent transparent;
|
||||
transform-origin: 0 0;
|
||||
transform: rotate(-45deg);
|
||||
box-shadow: 6px -6px 10px -3px rgba(92, 97, 104, 0.14);
|
||||
}
|
||||
}
|
||||
|
||||
.solid-notifications__list {
|
||||
border: none;
|
||||
@ -115,8 +148,8 @@ solid-notifications {
|
||||
box-shadow: 0 0 7px 0 rgba(92, 97, 104, 0.24);
|
||||
max-height: calc(100vh - 84px);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 4.5rem;
|
||||
right: -30px !important;
|
||||
top: 3.99em !important;
|
||||
width: 100vw;
|
||||
|
||||
/* Custom scrollbar */
|
||||
|
Loading…
Reference in New Issue
Block a user