@deque/cauldron-styles 6.1.0-canary.e8a7f45e → 6.1.0-canary.ef37e977

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.css +73 -2
  2. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -1061,8 +1061,8 @@ a.IconButton {
1061
1061
  }
1062
1062
 
1063
1063
  .Dialog__close svg {
1064
- height: 100%;
1065
- width: 100%;
1064
+ /* match icon size with height/width of button */
1065
+ --icon-size: 100%;
1066
1066
  }
1067
1067
 
1068
1068
  .cauldron--theme-dark .Dialog__close {
@@ -5027,3 +5027,74 @@ button.Accordion__trigger {
5027
5027
  padding: var(--space-smaller);
5028
5028
  text-align: center;
5029
5029
  }
5030
+
5031
+ :root {
5032
+ --timeline-mark-color: var(--accent-success-dark);
5033
+ --timeline-mark-border-color: #fff;
5034
+ --timeline-separator-color: var(--gray-40);
5035
+ --timeline-icon-size: 18px;
5036
+ }
5037
+
5038
+ .cauldron--theme-dark {
5039
+ --timeline-mark-color: var(--accent-success-light);
5040
+ --timeline-mark-border-color: var(--accent-medium);
5041
+ --timeline-separator-color: #54636f;
5042
+ }
5043
+
5044
+ .Timeline {
5045
+ margin: 0;
5046
+ padding: 0;
5047
+ }
5048
+
5049
+ .Timeline:is(ol) {
5050
+ list-style-type: none;
5051
+ }
5052
+
5053
+ .TimelineItem {
5054
+ display: flex;
5055
+ margin-left: var(--space-smaller);
5056
+ }
5057
+
5058
+ .TimelineItem:not(:last-child) {
5059
+ min-height: 3.75rem;
5060
+ padding-bottom: var(--space-half);
5061
+ }
5062
+
5063
+ .TimelineItem:not(:last-child) .TimelineItem__details {
5064
+ padding-bottom: var(--space-smaller);
5065
+ }
5066
+
5067
+ .TimelineItem__separator {
5068
+ display: flex;
5069
+ flex-direction: column;
5070
+ width: var(--timeline-icon-size);
5071
+ --icon-size: var(--timeline-icon-size);
5072
+ }
5073
+
5074
+ .TimelineItem__separator:empty:before,
5075
+ .TimelineItem__separator > * {
5076
+ transform: translateX(calc(-50% + 2px));
5077
+ margin-bottom: var(--space-smallest);
5078
+ max-width: var(--timeline-icon-size);
5079
+ }
5080
+
5081
+ .TimelineItem__separator:empty:before {
5082
+ content: '';
5083
+ display: block;
5084
+ height: 8px;
5085
+ width: 8px;
5086
+ margin-top: var(--space-half);
5087
+ border-radius: 50%;
5088
+ background-color: var(--timeline-mark-color);
5089
+ }
5090
+
5091
+ .TimelineItem:not(:last-child) .TimelineItem__separator:after {
5092
+ content: '';
5093
+ display: block;
5094
+ flex: 1;
5095
+ width: 6px;
5096
+ border-radius: 3px;
5097
+ background-color: var(--timeline-separator-color);
5098
+ border: 1px solid var(--timeline-mark-border-color);
5099
+ transform: translateX(-1px);
5100
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deque/cauldron-styles",
3
- "version": "6.1.0-canary.e8a7f45e",
3
+ "version": "6.1.0-canary.ef37e977",
4
4
  "license": "MPL-2.0",
5
5
  "description": "deque cauldron pattern library styles",
6
6
  "repository": "https://github.com/dequelabs/cauldron",