Merge pull request #243 from vdvibhu20/scale-down

Scale down

Author: abhishek97

examples/components/nav-bar.hbs

@@ -64,45 +64,49 @@
                         <span class="notify-dot new"></span>
                         <i class="fas fa-bell"></i>
                     </div>
-                    <div class="dropdown-ul o-notification display-none">
-                        <div class="dropdown-li row no-gutters">
-                            <div class="notify-type col-2 ">
+                    <div class="dropdown-ul o-notification">
+                        <div class="dropdown-li row">
+                            <div class="notify-type col-2 justify-content-center align-items-center">
                                 <div class="notify-icon">
                                     <span class="notify-dot new"></span>
-                                    <img src="images/announcement.png" alt="">
+                                    <img src="images/announcement.svg" alt="">
                                 </div>
                             </div>
+                            
                             <div class="notify-text col-10">Please hard refresh (Ctrl  Shift  R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
                                 issues for you.</div>
                         </div>
 
-                        <div class="dropdown-li row no-gutters">
-                            <div class="notify-type col-2 ">
+                        <div class="dropdown-li row">
+                
+                            <div class="notify-type col-2 justify-content-center align-items-center">
                                 <div class="notify-icon">
                                     <span class="notify-dot new"></span>
-                                    <img src="images/announcement.png" alt="">
+                                    <img src="images/announcement.svg" alt="">
                                 </div>
                             </div>
                             <div class="notify-text col-10">Please hard refresh (Ctrl  Shift  R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
                                 issues for you.</div>
                         </div>
 
-                        <div class="dropdown-li row no-gutters">
-                            <div class="notify-type col-2 ">
+                        <div class="dropdown-li row">
+                
+                            <div class="notify-type col-2 justify-content-center align-items-center">
                                 <div class="notify-icon">
                                     <span class="notify-dot new"></span>
-                                    <img src="images/announcement.png" alt="">
+                                    <img src="images/announcement.svg" alt="">
                                 </div>
                             </div>
                             <div class="notify-text col-10">Please hard refresh (Ctrl  Shift  R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
                                 issues for you.</div>
                         </div>
 
-                        <div class="dropdown-li row no-gutters">
-                            <div class="notify-type col-2 ">
+                        <div class="dropdown-li row">
+                
+                            <div class="notify-type col-2 justify-content-center align-items-center">
                                 <div class="notify-icon">
                                     <span class="notify-dot new"></span>
-                                    <img src="images/announcement.png" alt="">
+                                    <img src="images/announcement.svg" alt="">
                                 </div>
                             </div>
                             <div class="notify-text col-10">Please hard refresh (Ctrl  Shift  R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
@@ -115,10 +119,12 @@
                     {{>button type='solid' text='Login'}}
                 </li> --}}
             </ul>
-
+        
             <div class="round-img">
                 <img src="/images/c++ode-red.svg" alt="">
             </div>
+            
+            
 
             <div class="card">
                 <div class="top-offset"></div>

sass/styles/elements/elements.notify-type.scss

@@ -7,6 +7,7 @@
 
 .notify-icon{
   width: 20px;
+  position: relative;
 }
 
 
@@ -17,7 +18,7 @@
   display: none;
   position: absolute;
   left: 100%;
-  top: -7px;
+  top: -5px;
 }
 
 .new{

sass/styles/objects/o-courses/o-courses.scss

@@ -1,5 +1,5 @@
 .container-courses {
-  padding: 5%;
+  padding: 2% 5%;
 
   .status-circle {
      transform: none;

sass/styles/objects/o-nav-layout/o-nav-layout.scss

@@ -12,10 +12,6 @@
   .notify-dot{
     @include dimensions(8px, 8px);
   }
-
-  .notify-icon{
-    width: unset;
-  }
 }
 
 .main-nav{
@@ -30,10 +26,15 @@
   .nav-list {
     margin-top: 0;
   }
-  
+
+  .nav-items>.notify-icon{
+    width: 10px;
+  }
+
   .round-img{
     @include dimensions(40px, 40px);
     cursor: pointer;
+    margin-left: 40px;
   }
 
   .round-img:hover{

sass/styles/objects/o-notification/o-notification.scss

@@ -1,6 +1,4 @@
 .o-notification{
-  padding-right: 10%;
-  padding-left: 40%;
   text-transform: none;
   right: 0;
   left: unset;

sass/styles/objects/o-overview-container/o-overview-container.scss

@@ -1,5 +1,5 @@
 .overview-container {
-  padding:5%;
+  padding: 2% 5%;
 }
 
 .o-overview-recent {