enhanced UI, added CSS , corrected Readme and Fixed issue #72

README.md

@@ -25,7 +25,7 @@ The [Adobe Creative Cloud](http://www.adobe.com/products/creativecloud.html) is
 
 ## Be in touch!
 
-We hope you love this new homepage. Any feedback, ideas or bugfixes are very much welcome. Here is the [Trello board](https://trello.com/b/eLlfvaVe/adobe-gb.xjqchip.workers.dev) on which you can add your ideas. You can also check out the [wiki page](https://github.com/adobe/adobe.github.com/wiki) to know how to update the page easily. 
+We hope you love this new homepage. Any feedback, ideas, or bug fixes are very much welcome. Here is the [Trello board](https://trello.com/b/eLlfvaVe/adobe-gb.xjqchip.workers.dev) on which you can add your ideas. You can also check out the [wiki page](https://github.com/adobe/adobe.github.com/wiki) to know how to update the page easily. 
 
 All this seems interesting to you? Want to start contributing to the web with Adobe?
 
@@ -37,9 +37,9 @@ Hummm... want to learn more about how all this is structured? A good sketch is b
 
 <p align="center"> <img src="https://raw.github.com/adobe/adobe.github.com/master/img/schema_adobe_open_source.png"  alt="Adobe Open Source schema" /></p>
 
-The information is pulled directly from the [Github API](http://developer.github.com/v3/) and aggregated by a [NodeJS](http://nodejs.org) server (its code source is available [in this repository](https://github.com/adobe/server.adobe.github.com)). It is available through an simple REST API, thanks to [restify](http://mcavage.me/node-restify/).
+The information is pulled directly from the [Github API](http://developer.github.com/v3/) and aggregated by a [NodeJS](http://nodejs.org) server (its code source is available [in this repository](https://github.com/adobe/server.adobe.github.com)). It is available through a simple REST API, thanks to [restify](http://mcavage.me/node-restify/).
 
-[AngularJS](http://angularjs.org/) then makes a unique API call to the server and inject the data on your browser, based on the [Foundation](http://foundation.zurb.com/) CSS framework and using [dc.js](http://nickqizhu.github.io/dc.js/) for the graphs. The filtering engine for the repositories was built on top of Angular.
+[AngularJS](http://angularjs.org/) then makes a unique API call to the server and injects the data on your browser, based on the [Foundation](http://foundation.zurb.com/) CSS framework and using [dc.js](http://nickqizhu.github.io/dc.js/) for the graphs. The filtering engine for the repositories was built on top of Angular.
 
 ## Deploying Locally
 

cla.html

@@ -86,12 +86,27 @@
       </div>
     </div>
 
-    <iframe
+    <style>
+      .docs{
+        border: 0; overflow: hidden; min-height: 500px; min-width: 600px; margin-top: 35px;
+      }
+      @media only screen and (max-width: 800px) {
+       .docs{
+        margin-top: 80px;
+       }
+      }
+      @media only screen and (max-width: 445px) {
+       .docs{
+        margin-top: 100px;
+       }
+      }
+    </style>
+
+    <iframe class="docs"
       src="https://adobe.na1.documents.adobe.com/public/esignWidget?wid=CBFCIBAA3AAABLblqZhCSt6j3rlOsjJYtaVDbSFP8yMe0S67pjh2eTmCguy2UX6WxVS5h4bt6Wzs6-HcCTLM*&hosted=false"
       width="100%"
       height="100%"
       frameborder="0"
-      style="border: 0; overflow: hidden; min-height: 500px; min-width: 600px;"
     ></iframe>
   </body>
 </html>

index.html

@@ -27,6 +27,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
     <title>Adobe Open Source | Advancing technology through open initiatives</title>
+    <meta name="description" content="Adobe Open Source | Advancing technology through open initiatives">
     <link href="stylesheets/app.css" rel="stylesheet">
     <link rel="stylesheet" href="stylesheets/clastyles.css">
     <link href= "https://ajax.googleapis.com/ajax/libs/angularjs/1.7.7/angular.min.js">
@@ -136,7 +137,7 @@ <h4>Statistics</h4>
                     </div>
 
                     <div class="large-6 columns">
-                        <img class="logo logoFeatured first" ng-src="{{featured.logo}}" title="{{featured.title}}" />
+                        <img class="logo  logoFeatured first" ng-src="{{featured.logo}}" title="{{featured.title}}" />
                     </div>
                 </div>
             </div>
@@ -316,7 +317,7 @@ <h5 class="details">...and with <a target="_blank" href="http://angularjs.org/"
                 <div class="small-5 columns">
                     <div class="logo" id="logo3">
                         <a href="https://github.com/adobe/adobe.github.com" target="_blank">
-                            <img src="img/github_logo.svg" title="Github" alt="github_logo" />
+                            <img src="img/github_logo.svg" title="View on Github" alt="github_logo" />
                         </a>
                     </div>
                 </div>

stylesheets/app.css

@@ -5,6 +5,10 @@
 /**
  * Correct `block` display not defined in IE 8/9.
  */
+
+ html {
+  scroll-behavior: smooth;
+}
 /* line 22, sass/_normalize.scss */
 article,
 aside,
@@ -227,6 +231,7 @@ sub {
 /* line 227, sass/_normalize.scss */
 img {
   border: 0;
+  margin:5px;
 }
 
 /**
@@ -7314,7 +7319,7 @@ form.custom .custom.dropdown.open.medium ul {
 /* line 89, sass/app.scss */
 .head-anchor {
   position: absolute;
-  margin-top: -50px;
+  margin-top: -90px;
 }
 
 /* line 94, sass/app.scss */
@@ -7429,7 +7434,7 @@ form.custom .custom.dropdown.open.medium ul {
 /* line 205, sass/app.scss */
 .header-inline {
   background: #e9e9e9;
-  height: 300px;
+  height: 400px;
   width: 100%;
   overflow: hidden;
   position: relative;
@@ -7440,19 +7445,22 @@ form.custom .custom.dropdown.open.medium ul {
   position: absolute;
   z-index: 99;
   left: 100%;
-  overflow: hidden;
+  /* overflow: hidden; */
   -webkit-transition: left 0.5s;
   -moz-transition: left 0.5s;
   -o-transition: left 0.5s;
   transition: left 0.5s;
   background: #e9e9e9;
   width: 100%;
-  height: 300px;
+  height: 450px;
 }
 /* line 219, sass/app.scss */
 .header-inline .wrapper.actual {
   left: 0;
+
 }
+
+
 /* line 221, sass/app.scss */
 .header-inline .wrapper > .row {
   position: relative;
@@ -7480,7 +7488,8 @@ form.custom .custom.dropdown.open.medium ul {
 }
 /* line 246, sass/app.scss */
 .header-inline .wrapper .logo {
-  position: absolute;
+  /* position: absolute; */
+  margin-top: 30px;
   margin-left: 10%;
   width: 80%;
 }
@@ -7672,13 +7681,21 @@ form.custom .custom.dropdown.open.medium ul {
   position: absolute;
   top: -10px;
   right: 20px;
+  margin: 5px;
   overflow: hidden;
   height: 100px;
   -webkit-transition: height 0.2s;
   -moz-transition: height 0.2s;
   -o-transition: height 0.2s;
   transition: height 0.2s;
 }
+@media only screen and (max-width: 345px) {
+  .menu .wrapLogoTop {
+    margin: 5px;
+    right: 0px;
+
+  }
+  }
 /* line 427, sass/app.scss */
 .menu .logoTop {
   width: 45px;