Merge pull request #4423 from appirio-tech/feature/new-milestone-concept

[DEV] Milestones Management

Author: RishiRajSahu

.circleci/config.yml

@@ -188,7 +188,7 @@ workflows:
             - build-dev
           filters: &filters-dev
             branches:
-              only: ['dev', 'feature/copilot-feedback']
+              only: ['dev', 'feature/new-milestone-concept']
 
       - deployTest01:
           context : org-global

src/assets/icons/icon-check-thin.svg

@@ -29,6 +29,7 @@ const Layout = (props) => {
         </div>
         <Footer />
         <GatewayDest name="fullscreen-page" className="mobile-page-gateway" />
+        <GatewayDest name="right-sidebar" className="right-sidebar-container" />
       </div>
     )
   }

src/assets/icons/icon-dots.svg

@@ -23,4 +23,35 @@
       background-color: $tc-gray-neutral-light;
     }
   }
+
+  .right-sidebar-container {
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    width: 310px;
+    z-index: 9999;
+    transform: translateX(310px);
+    transition: transform 225ms ease;
+
+    &:not(:empty) {
+      transform: translateX(0);
+
+      &::before {
+        content: '';
+        position: absolute;
+        top: -100vh;
+        left: -100vw;
+        width: 200vw;
+        height: 200vh;
+        z-index: -1;
+      }
+
+      @media screen and (max-width: $screen-md - 1px) {
+        width: 100%;
+        transition: none;
+      }
+    }
+  }
 }
+

src/assets/icons/icon-gnatt-gray.svg

@@ -18,7 +18,7 @@ const Themes = {
 
 const ProjectProgress = ({type, percent, children, viewType=ViewTypes.HBAR }) => (
   <div className="project-progress">
-    { viewType === ViewTypes.HBAR && 
+    { viewType === ViewTypes.HBAR &&
       <div className="progress-bar">
         <div className={cn('progress', type)} style={{width: percent + '%'}} />
       </div>
@@ -35,14 +35,13 @@ ProjectProgress.ViewTypes = ViewTypes
 ProjectProgress.Themes = Themes
 
 ProjectProgress.defaultProps = {
-  type: Themes.BLUE 
+  type: Themes.BLUE
 }
 
 ProjectProgress.propTypes = {
-  title: PropTypes.string.isRequired,
   type: PropTypes.oneOf(_.values(Themes)),
   percent: PropTypes.number.isRequired,
-  children: PropTypes.any.isRequired
+  children: PropTypes.any
 }
 
 export default ProjectProgress

src/assets/icons/icon-x-mark-thin.svg

@@ -27,7 +27,7 @@ TwoColsLayout.Sidebar = ({ children, wrapperClass }) => (
 
 TwoColsLayout.Content = ({ children }) => (
   <div styleName="content">
-    <div styleName="content-inner">
+    <div styleName="content-inner" className="twoColsLayout-contentInner">
       {children}
     </div>
   </div>