Use "Go to latest" link

Author: alisinabh

assets/css/custom-props/common.css

@@ -52,8 +52,8 @@
   --black: hsl(0, 0%, 0%);
   --black-opacity-10: hsla(0, 0%, 0%, 10%);
   --black-opacity-50: hsla(0, 0%, 0%, 50%);
-  --orangeDark: hsl(30, 80%, 50%);
-  --orange: hsl(30, 100%, 50%);
+  --orangeDark: hsl(30, 90%, 40%);
+  --orangeLight: hsl(30, 80%, 50%);
 }
 
 @media screen and (max-width: 768px) {

assets/css/custom-props/theme-light.css

@@ -80,7 +80,7 @@
   --sidebarHover:                var(--black);
   --sidebarScrollbarThumb:       var(--coldGrayLight);
   --sidebarScrollbarTrack:       var(--sidebarBackground);
-  --sidebarStaleVersion:         var(--orange);
+  --sidebarStaleVersion:         var(--orangeLight);
   --sidebarSubheadings:          var(--black);
   --sidebarItem:                 var(--black);
   --sidebarInactiveItemBorder:   var(--gray500);

assets/css/sidebar.css

@@ -110,16 +110,19 @@
 }
 
 .sidebar .sidebar-staleVersion {
+    display: inline;
+    padding-left: 8px;
+}
+
+.sidebar .sidebar-staleVersion > a {
     color: var(--sidebarStaleVersion);
-    padding-left: 28px;
+    font-weight: 400;
 }
 
 .sidebar .sidebar-staleIcon {
-    color: var(--sidebarStaleVersion);
-    position: absolute;
-    top: 0.5px;
-    left: 10px;
-    font-size: 16px;
+    font-size: 18px;
+    position: relative;
+    top: 3px;
 }
 
 .sidebar .sidebar-list-nav {

assets/js/handlebars/templates/versions-dropdown.handlebars

@@ -2,16 +2,20 @@
   <label>
     <span class="sidebar-projectVersionsDropdownCaret" aria-hidden="true">&#x25bc;</span>
     <span class="sr-only">Project version</span>
-    {{#if latestVersion}}
-      <i class="ri-alert-line sidebar-staleIcon" aria-hidden="true"></i>
-      <span class="sr-only">This version is not the latest version of the package</span>
-    {{/if}}
-    <select class="sidebar-projectVersionsDropdown{{#if latestVersion}} sidebar-staleVersion{{/if}}"{{#if latestVersion}} title="This version is not the latest version of the package."{{/if}}>
+    <select class="sidebar-projectVersionsDropdown">
       {{#each nodes}}
         <option translate="no" value="{{url}}"{{#if isCurrentVersion}} selected disabled{{/if}}>
           {{version}}
         </option>
       {{/each}}
     </select>
   </label>
+  {{#if latestVersion}}
+    <div class="sidebar-staleVersion">
+      <a href="{{latestVersion}}" title="This version of package is not the latest version">
+        <i class="ri-alert-line sidebar-staleIcon" aria-hidden="true"></i>
+        <span>Go to latest</span>
+      </a>
+    </div>
+  {{/if}}
 </form>