summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/view-models/shared
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/app/view-models/shared')
-rw-r--r--catalog-ui/src/app/view-models/shared/notification-custom-template.html1
-rw-r--r--catalog-ui/src/app/view-models/shared/notification-template.less53
2 files changed, 53 insertions, 1 deletions
diff --git a/catalog-ui/src/app/view-models/shared/notification-custom-template.html b/catalog-ui/src/app/view-models/shared/notification-custom-template.html
index 869c49bacf..9456b87093 100644
--- a/catalog-ui/src/app/view-models/shared/notification-custom-template.html
+++ b/catalog-ui/src/app/view-models/shared/notification-custom-template.html
@@ -13,7 +13,6 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
-
<div class="ui-notification">
<div class="notification-container">
<div class="icon-container">
diff --git a/catalog-ui/src/app/view-models/shared/notification-template.less b/catalog-ui/src/app/view-models/shared/notification-template.less
new file mode 100644
index 0000000000..5baf10d411
--- /dev/null
+++ b/catalog-ui/src/app/view-models/shared/notification-template.less
@@ -0,0 +1,53 @@
+.notification-container{
+ display: flex;
+ padding: 15px 11px;
+ float: left;
+ .icon-container{
+ flex-grow: 1;
+ margin-right: 20px;
+ .icon-circle{
+ background-color: black;
+ height: 40px;
+ width: 40px;
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ margin-right: 0;
+ background-color: rgba(255, 255, 255, 0.3);
+ .icon{
+ margin: 0 auto;
+ display: block;
+ }
+ }
+ }
+ .msg-content{
+ flex-grow: 3;
+ h3{
+ border-bottom: none;
+ font-weight: 400;
+ .f-type._18_m;
+ }
+ .message{
+ font-weight: 300;
+ .f-type._14_m;
+ }
+ }
+}
+.ui-notification.success{
+ background-color: @main_color_d;
+ .icon{
+ .notification-success-icon;
+ }
+}
+.ui-notification.error{
+ background-color: @func_color_q;
+ .icon{
+ .notification-error-icon;
+ }
+}
+.ui-notification.info{
+ background-color: @main_color_a;
+ .icon{
+ .notification-process-icon;
+ }
+}