@deque/cauldron-styles 5.2.0 → 5.3.0-canary.076e2338

package/dist/index.css

@@ -31,6 +31,7 @@
   --accent-warning: #ffdd75;
   --accent-warning-light: #ffa1a1;
   --accent-caution: #ffe69f;
+  --accent-warning-dark: #b88a00;
   --accent-info: #6cdaf2;
   --accent-info-light: #83e4fa;
   --accent-primary: #3c7aae;
@@ -564,7 +565,6 @@ button.Link {
   min-height: var(--button-thin-height);
   min-width: 100px;
   font-size: var(--text-size-smallest);
-  line-height: var(--text-size-smallest);
   padding: 0 16px;
 }
 
@@ -1633,6 +1633,13 @@ textarea.Field--has-error:focus:hover,
   flex-wrap: wrap;
 }
 
+.Radio--inline {
+  display: flex;
+  align-items: baseline;
+  flex-wrap: wrap;
+  gap: var(--space-small);
+}
+
 .Checkbox {
   margin-bottom: var(--space-smallest);
 }
@@ -2063,6 +2070,7 @@ p .Link {
   width: 100%;
   min-height: var(--select-min-height);
   padding: var(--space-three-quarters) var(--space-smallest);
+  padding-right: var(--space-large);
   border: 1px solid var(--field-border-color);
   font-family: Roboto;
   font-weight: normal;
@@ -2431,7 +2439,7 @@ p .Link {
   align-items: center;
   box-sizing: border-box;
   display: flex;
-  padding: 4px 15px;
+  padding: var(--space-smallest) var(--space-small);
 }
 
 .Toast.Toast--non-dismissible {
@@ -3133,7 +3141,7 @@ button.TooltipTabstop {
 }
 
 .Code .hljs-quote {
-  color: #969896;
+  color: #666666;
   font-style: italic;
 }
 
@@ -3193,11 +3201,11 @@ button.TooltipTabstop {
 .Code .hljs-subst,
 .Code .hljs-meta,
 .Code .hljs-link {
-  color: #f99157;
+  color: #8a3500;
 }
 
 .Code .hljs-deletion {
-  color: #dc322f;
+  color: #c92e40;
 }
 
 .Code .hljs-formula {
@@ -3228,6 +3236,14 @@ button.TooltipTabstop {
   color: #cc99cc;
 }
 
+.cauldron--theme-dark .Code .hljs-symbol,
+.cauldron--theme-dark .Code .hljs-bullet,
+.cauldron--theme-dark .Code .hljs-subst,
+.cauldron--theme-dark .Code .hljs-meta,
+.cauldron--theme-dark .Code .hljs-link {
+  color: #f99157;
+}
+
 .cauldron--theme-dark .Code .hljs-comment {
   color: #9f9f9f;
 }
@@ -3241,6 +3257,11 @@ button.TooltipTabstop {
   color: var(--accent-primary-active);
 }
 
+.cauldron--theme-dark .Code .hljs-name,
+.cauldron--theme-dark .Code .hljs-section {
+  color: #79a7d9;
+}
+
 .cauldron--theme-dark .Code .hljs-variable,
 .cauldron--theme-dark .Code .hljs-template-variable,
 .cauldron--theme-dark .Code .hljs-tag,
@@ -3473,7 +3494,7 @@ button.TooltipTabstop {
   font-size: var(--text-size-small);
   border-collapse: collapse;
   text-align: left;
-  width: 100%;
+  width: var(--table-width, 100%);
   overflow-wrap: break-word;
 }
 
@@ -3826,16 +3847,6 @@ button.TooltipTabstop {
   --panel-content-color: var(--gray-80);
 }
 
-/* Resets aggressive Chrome user agent styles */
-
-.Panel > :is(.Panel__Header, .Panel__Content, .Panel__Heading) > *,
-.Panel:first-child > :not(.Panel__Header, .Panel__Heading, .Panel__Content) {
-  -webkit-margin-before: 0;
-  -webkit-margin-after: 0;
-  margin-block-start: 0;
-  margin-block-end: 0;
-}
-
 .Panel {
   padding: var(--panel-padding);
   margin: 0;
@@ -3868,6 +3879,10 @@ button.TooltipTabstop {
     var(--space-small) calc(var(--panel-padding) * -1);
 }
 
+.Panel__Heading + .Panel__Content {
+  margin-top: calc(var(--panel-padding) * -1);
+}
+
 .Panel__Header {
   margin: calc(var(--panel-padding) * -1) calc(var(--panel-padding) * -1) 0
     calc(var(--panel-padding) * -1);
@@ -3882,6 +3897,17 @@ button.TooltipTabstop {
   margin: 0 calc(var(--panel-padding) * -1);
 }
 
+.Panel > :not(.Panel__Heading, .Panel__Header, .Panel__Content):first-child,
+.Panel > :is(.Panel__Heading, .Panel__Header) + :not(.Panel__Content),
+.Panel__Content > :first-child {
+  margin-top: 0;
+}
+
+.Panel > :not(.Panel__Heading, .Panel__Header, .Panel__Content):last-child,
+.Panel__Content > :last-child {
+  margin-bottom: 0;
+}
+
 .Panel
   :is(.Panel__Header + .Panel__Content, .Panel__Content + .Panel__Content) {
   border-top: 1px solid var(--panel-divider-border-color);
@@ -3907,12 +3933,16 @@ button.TooltipTabstop {
   color: var(--panel-heading-color);
 }
 
+.Panel > :is(.Panel__Header, .Panel__Heading) > :is(h1, h2, h3, h4, h5, h6) {
+  margin: 0;
+}
+
 .Panel--collapsed {
   --panel-padding: 12px;
 }
 
 .Panel--collapsed .Panel__Heading {
-  margin: 0 0 12px 0;
+  margin: 0 0 var(--panel-padding) 0;
   font-size: var(--text-size-normal);
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-styles",
-  "version": "5.2.0",
+  "version": "5.3.0-canary.076e2338",
   "license": "MPL-2.0",
   "description": "deque cauldron pattern library styles",
   "repository": "https://github.com/dequelabs/cauldron",
@@ -22,4 +22,4 @@
     "postcss-cli": "^7.1.1",
     "postcss-import": "^12.0.1"
   }
-}
+}