Merge pull request #9754 from circleci/style-fix

various style fixes DOCSS-1836

Author: rosieyohannan

ui/src/css/doc.css

@@ -518,7 +518,7 @@
   display: flex !important;
   align-items: center;
   border: 2px solid transparent;
-  border-radius: 8px;
+  border-radius: 12px;
   padding: 1rem;
   box-sizing: border-box;
   padding: 1rem 1rem 0.75rem;
@@ -950,7 +950,7 @@
   display: flex !important;
   align-items: center;
   border: 2px solid transparent;
-  border-radius: 8px;
+  border-radius: 12px;
   border-color: #1A66F7;
   padding: 1rem;
   box-sizing: border-box;
@@ -1021,7 +1021,7 @@
 /* Style listing blocks with titles */
 .doc .listingblock > .title {
   background: var(--pre-title-background);
-  border-radius: 8px 8px 0 0;
+  border-radius: 12px 12px 0 0;
   padding: 0.5em 0.875em;
   margin-bottom: 0;
   position: relative;
@@ -1050,17 +1050,17 @@
 
 /* When title is collapsed, adjust the border radius */
 .doc .listingblock > .title.collapsed {
-  border-radius: 8px;
+  border-radius: 12px;
 }
 
 /* When a title is present, adjust the code block border radius */
 .doc .listingblock > .title + .content pre {
-  border-radius: 0 0 8px 8px;
+  border-radius: 0 0 12px 12px;
 }
 
-/* When title is not present, use border-radius: 8px for code blocks */
+/* When title is not present, use border-radius: 12px for code blocks */
 .doc .listingblock > .content pre {
-  border-radius: 8px;
+  border-radius: 12px;
 }
 
 /* Keep existing position relative for the content */
@@ -1073,7 +1073,7 @@
   flex-direction: column;
   align-items: center;
   position: absolute;
-  top: 0.25rem;
+  top: 0.5rem;
   right: 0.5rem;
   color: var(--pre-annotation-font-color);
   font-family: var(--body-font-family);

ui/src/partials/header-content.hbs

@@ -16,7 +16,7 @@
     <div class="flex items-center space-x-4 ml-2">
       <!--<img src="{{{uiRootPath}}}/img/language-icon.svg" alt="Language Icon" class="h-5 w-5">-->
       <img data-page-navigation-toggle src="{{{uiRootPath}}}/img/nav-menu.svg" alt="Navigation Menu Icon" class="h-5 w-5 lg:hidden">
-      <a href="https://app.circleci.com/" class="hidden md:block bg-slime-green text-dark-green rounded-full px-[16px] border py-[8px] border-operational-green">
+      <a href="https://app.circleci.com/" class="hidden md:block bg-slime-green text-dark-green rounded-full px-[16px] border py-[8px] border-operational-green font-medium">
         Go to Application
       </a>
     </div>

ui/src/partials/navigation-tree.hbs

@@ -10,11 +10,11 @@
           </button>
         {{/if}}
         {{#if (and ./url (not (eq ./url @root.page.url)))}}
-          <a class="nav-link hover:text-link-on-light {{#if (has-active-child ./items)}}font-medium text-inherit {{/if}}" href="
+          <a class="nav-link hover:text-link-on-light {{#if (has-active-child ./items)}}font-semibold text-inherit {{/if}}" href="
             {{~#if (eq ./urlType 'internal')}}{{{relativize ./url}}}
             {{~else}}{{{./url}}}{{~/if}}">{{{./content}}}</a>
           {{else}}
-          <span class="{{#if (has-active-child ./items)}}text-accent-green font-medium text-inherit{{/if}}">{{{./content}}}</span>
+          <span class="{{#if (has-active-child ./items)}}text-accent-green font-semibold text-inherit{{/if}}">{{{./content}}}</span>
         {{/if}}
       </div>
     {{/if}}