Improve tabset corners; rework border-radius across styles (#2077)

Reintroduces some controlled variance to help differentiate elements.

Author: DavidOliver

assets/css/autocomplete.css

@@ -107,7 +107,7 @@
 
 .autocomplete-suggestions {
   background-color: var(--autocompleteBackground);
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-base);
   box-shadow: 0px 15px 99px 0px var(--autocompleteBorder);
   overflow-y: auto;
   max-height: 450px;
@@ -167,7 +167,7 @@
   align-items: center;
   text-decoration: none;
   border: 1px solid var(--suggestionBorder);
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-base);
   transition: var(--transition-colors);
   background-color: var(--autocompletePreview);
   cursor: pointer;

assets/css/content/admonition.css

@@ -1,5 +1,5 @@
 .content-inner section.admonition {
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-base);
   border-left: 0;
 }
 

assets/css/content/bottom-actions.css

@@ -13,7 +13,7 @@
   display: flex;
   text-decoration: none;
   flex-direction: column;
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-sm);
   border: 1px solid var(--bottomActionsBtnBorder);
   padding: 12px 16px;
   min-width: 150px;

assets/css/content/cheatsheet.css

@@ -97,7 +97,7 @@
 
 .page-cheatmd .content-inner .h2 p > code {
   color: #eb5757;
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-sm);
   padding: 0.2em 0.4em;
 }
 
@@ -156,7 +156,7 @@
 
 .page-cheatmd .content-inner .h2 td code {
   color: #eb5757;
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-sm);
   padding: 0.2em 0.4em;
 }
 
@@ -195,7 +195,7 @@
 
 .page-cheatmd .content-inner .h2 li > code {
   color: #eb5757;
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-sm);
   padding: 0.2em 0.4em;
 }
 

assets/css/content/code.css

@@ -19,14 +19,14 @@
 .content-inner code {
   background-color: var(--codeBackground);
   vertical-align: baseline;
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-sm);
   padding: .1em .2em;
   border: 1px solid var(--codeBorder);
   text-transform: none;
 }
 
 .content-inner code.inline {
-  border-radius: 4px;
+  border-radius: var(--borderRadius-sm);
   word-wrap: break-word;
 }
 

assets/css/content/functions.css

@@ -106,6 +106,6 @@
   display: block;
   padding: 1em;
   background-color: var(--fnDeprecated);
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-sm);
   margin: var(--baseLineHeight) 0;
 }

assets/css/content/general.css

@@ -132,7 +132,7 @@
   padding: 0 1.2rem;
   overflow: auto;
   background-color: var(--blockquoteBackground);
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-base);
 }
 .content-inner blockquote p:last-child, .content-inner section.admonition p:last-child  {
   padding-bottom: 1em;

assets/css/copy-button.css

@@ -16,7 +16,7 @@ pre .copy-button:focus {
   padding: 8px;
   background-color: transparent;
   backdrop-filter: blur(8px);
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-sm);
   border: 1px solid var(--codeBorder);
   cursor: pointer;
   transition: var(--transition-all);

assets/css/custom-props/common.css

@@ -2,7 +2,9 @@
   /* Layout & Whitespace */
   --content-width: 949px;
   --content-gutter: 60px;
-  --borderRadius: 8px;
+  --borderRadius-lg: 14px;
+  --borderRadius-base: 8px;
+  --borderRadius-sm: 3px;
   --navTabBorderWidth: 2px;
 
   /* Font Families */

assets/css/keyboard-shortcuts.css

@@ -22,7 +22,7 @@
 #keyboard-shortcuts-content kbd > kbd {
   background-color: var(--settingsInputBorder);
   color: var(--contrast);
-  border-radius: var(--borderRadius);
+  border-radius: var(--borderRadius-sm);
   font-family: inherit;
   font-weight: bold;
   display: inline-block;