hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-18 15:33:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

notification start

Browse Source
This commit is contained in:
Andrea Chiapparelli - 4Science
2018-03-02 16:19:15 +01:00
parent e61fcdccdb
commit 8c555292ac
20 changed files with 1236 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
src/app/shared/notifications/notification/notification.component.scss Normal file
View File

@@ -0,0 +1,107 @@
.simple-notification {
width: 100%;
padding: 10px 20px;
box-sizing: border-box;
position: relative;
float: left;
margin-bottom: 10px;
color: #fff;
cursor: pointer;
transition: all 0.5s;
min-height: 70px;
}
.simple-notification .sn-title,
.simple-notification .sn-content,
.simple-notification .sn-html {
margin: 0;
}
.simple-notification .sn-title {
line-height: 30px;
font-size: 20px;
}
.simple-notification .sn-content {
font-size: 16px;
line-height: 20px;
}
.simple-notification.has-icon .sn-title,
.simple-notification.has-icon .sn-content,
.simple-notification.has-icon .sn-html {
padding: 0 50px 0 0;
}
.simple-notification .icon {
position: absolute;
box-sizing: border-box;
top: 0;
right: 0;
width: 70px;
height: 70px;
padding: 10px;
}
.simple-notification .icon.icon-hover:hover {
opacity: 0.5;
}
.simple-notification .icon svg {
fill: #fff;
width: 100%;
height: 100%;
}
.simple-notification .icon svg g {
fill: #fff;
}
.simple-notification.rtl-mode.has-icon .sn-title,
.simple-notification.rtl-mode.has-icon .sn-content,
.simple-notification.rtl-mode.has-icon .sn-html {
padding: 0 0 0 50px;
}
.simple-notification.rtl-mode {
direction: rtl;
}
.simple-notification.rtl-mode .sn-content {
padding: 0 0 0 50px;
}
.simple-notification.rtl-mode svg {
left: 0;
right: auto;
}
.simple-notification.error { background: #F44336; }
.simple-notification.success { background: #8BC34A; }
.simple-notification.alert { background: #ffdb5b; }
.simple-notification.info { background: #03A9F4; }
.simple-notification.warn { background: #ffdb5b; }
.simple-notification .sn-progress-loader {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 5px;
}
.simple-notification .sn-progress-loader span {
float: left;
height: 100%;
}
.simple-notification.success .sn-progress-loader span { background: #689F38; }
.simple-notification.error .sn-progress-loader span { background: #D32F2F; }
.simple-notification.alert .sn-progress-loader span { background: #edc242; }
.simple-notification.info .sn-progress-loader span { background: #0288D1; }
.simple-notification.warn .sn-progress-loader span { background: #edc242; }
.simple-notification.bare .sn-progress-loader span { background: #ccc; }
.simple-notification.warn div .sn-title,
.simple-notification.warn div .sn-content,
.simple-notification.warn div .sn-html { color: #444; }