@canonical/react-ds-app-launchpad 0.9.0-experimental.7 → 0.9.0-experimental.8
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.
- package/dist/esm/ui/FileTree/common/File/styles.css +4 -0
- package/dist/esm/ui/FileTree/common/Folder/styles.css +4 -0
- package/dist/esm/ui/FileTree/common/IndentationBlock/styles.css +32 -0
- package/dist/esm/ui/FileTree/common/Node/styles.css +60 -0
- package/dist/esm/ui/FileTree/common/SearchBox/styles.css +61 -0
- package/dist/esm/ui/GitDiffViewer/common/CodeDiffViewer/HighlighTheme.css +172 -0
- package/dist/esm/ui/GitDiffViewer/common/CodeDiffViewer/common/DiffLine/styles.css +111 -0
- package/dist/esm/ui/GitDiffViewer/common/CodeDiffViewer/styles.css +39 -0
- package/dist/esm/ui/GitDiffViewer/common/FileHeader/styles.css +75 -0
- package/dist/esm/ui/index.js +3 -1
- package/dist/esm/ui/index.js.map +1 -1
- package/dist/types/ui/index.d.ts +3 -1
- package/dist/types/ui/index.d.ts.map +1 -1
- package/package.json +3 -3
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/* @canonical/generator-ds 0.9.0-experimental.4 */
|
|
2
|
+
|
|
3
|
+
.ds.indentation-block {
|
|
4
|
+
display: inline-flex;
|
|
5
|
+
gap: var(--file-tree-node-items-gap);
|
|
6
|
+
align-items: center;
|
|
7
|
+
user-select: none;
|
|
8
|
+
|
|
9
|
+
& > .indent-block {
|
|
10
|
+
width: var(--file-tree-node-indent-width);
|
|
11
|
+
position: relative;
|
|
12
|
+
isolation: isolate;
|
|
13
|
+
|
|
14
|
+
padding: var(--file-tree-node-vertical-padding) 0;
|
|
15
|
+
&:not(.empty)::before {
|
|
16
|
+
content: "";
|
|
17
|
+
display: block;
|
|
18
|
+
position: absolute;
|
|
19
|
+
left: 50%;
|
|
20
|
+
top: 0;
|
|
21
|
+
bottom: 0;
|
|
22
|
+
transform: translateX(-50%);
|
|
23
|
+
width: var(--file-tree-node-indent-bar-width);
|
|
24
|
+
height: 100%;
|
|
25
|
+
background-color: var(--file-tree-node-indent-bar-color);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
&:has(> .indent-block.empty) {
|
|
29
|
+
width: 0;
|
|
30
|
+
margin-left: calc(-1 * var(--file-tree-node-items-gap));
|
|
31
|
+
}
|
|
32
|
+
}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
.ds.node {
|
|
2
|
+
list-style: none;
|
|
3
|
+
display: flex;
|
|
4
|
+
gap: var(--file-tree-node-items-gap);
|
|
5
|
+
align-items: center;
|
|
6
|
+
/* vertical padding is set on the indentation level */
|
|
7
|
+
padding: 0 var(--file-tree-node-horizontal-padding);
|
|
8
|
+
cursor: default;
|
|
9
|
+
color: var(--file-tree-node-text-color-default);
|
|
10
|
+
|
|
11
|
+
/* When the list is interactive we change colors on interactions */
|
|
12
|
+
&.selectable,
|
|
13
|
+
&.expandable {
|
|
14
|
+
cursor: pointer;
|
|
15
|
+
&:focus,
|
|
16
|
+
&:hover {
|
|
17
|
+
background-color: var(--file-tree-node-background-color-hover);
|
|
18
|
+
}
|
|
19
|
+
&:focus {
|
|
20
|
+
outline: 1px solid var(--file-tree-node-focus-outline-color);
|
|
21
|
+
outline-offset: -1px;
|
|
22
|
+
color: var(--file-tree-node-text-color-active);
|
|
23
|
+
& > .icon {
|
|
24
|
+
filter: opacity(1);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
/* When the list is static we apply active colors */
|
|
30
|
+
&:not(.selectable):not(.expandable) {
|
|
31
|
+
color: var(--file-tree-node-text-color-active);
|
|
32
|
+
& > .icon {
|
|
33
|
+
filter: opacity(1);
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
& > .icon {
|
|
38
|
+
user-select: none;
|
|
39
|
+
width: var(--file-tree-node-icon-size);
|
|
40
|
+
filter: opacity(0.6);
|
|
41
|
+
&.file {
|
|
42
|
+
content: var(--file-tree-node-file-icon);
|
|
43
|
+
}
|
|
44
|
+
&.folder {
|
|
45
|
+
content: var(--file-tree-node-closed-folder-icon);
|
|
46
|
+
&.expanded {
|
|
47
|
+
content: var(--file-tree-node-opened-folder-icon);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
& > .nodename {
|
|
52
|
+
flex: 1;
|
|
53
|
+
white-space: nowrap;
|
|
54
|
+
overflow: hidden;
|
|
55
|
+
text-overflow: ellipsis;
|
|
56
|
+
}
|
|
57
|
+
& > .marker {
|
|
58
|
+
display: inline-block;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
/* @canonical/generator-ds 0.9.0-experimental.4 */
|
|
2
|
+
|
|
3
|
+
.ds.search-box {
|
|
4
|
+
display: flex;
|
|
5
|
+
align-items: center;
|
|
6
|
+
border-bottom: 1px solid var(--file-tree-search-box-border-color);
|
|
7
|
+
padding: var(--file-tree-search-box-vertical-padding)
|
|
8
|
+
var(--file-tree-search-box-horizontal-padding);
|
|
9
|
+
&:has(.input:focus) {
|
|
10
|
+
outline: 2px solid -webkit-focus-ring-color;
|
|
11
|
+
outline-offset: -2px;
|
|
12
|
+
box-sizing: border-box;
|
|
13
|
+
}
|
|
14
|
+
& > .input {
|
|
15
|
+
flex: 1 1 100%;
|
|
16
|
+
|
|
17
|
+
vertical-align: baseline;
|
|
18
|
+
font-size: 1rem;
|
|
19
|
+
line-height: var(--file-tree-search-box-line-height);
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
& > .input:not(:valid) ~ .reset {
|
|
23
|
+
display: none;
|
|
24
|
+
}
|
|
25
|
+
& > .search,
|
|
26
|
+
& > .reset {
|
|
27
|
+
cursor: pointer;
|
|
28
|
+
width: var(--file-tree-search-box-button-size);
|
|
29
|
+
height: var(--file-tree-search-box-button-size);
|
|
30
|
+
display: inline-flex;
|
|
31
|
+
align-items: center;
|
|
32
|
+
justify-content: center;
|
|
33
|
+
background-color: transparent;
|
|
34
|
+
border: none;
|
|
35
|
+
}
|
|
36
|
+
& > .search > .icon {
|
|
37
|
+
content: var(--file-tree-search-box-search-icon);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
& > .reset > .icon {
|
|
41
|
+
content: var(--file-tree-search-box-reset-icon);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
/* remove search input default appearance */
|
|
45
|
+
& > .input {
|
|
46
|
+
border: none;
|
|
47
|
+
background-color: transparent;
|
|
48
|
+
&::-webkit-search-cancel-button {
|
|
49
|
+
appearance: none;
|
|
50
|
+
}
|
|
51
|
+
&:-webkit-autofill,
|
|
52
|
+
&:-webkit-autofill:hover,
|
|
53
|
+
&:-internal-autofill-selected,
|
|
54
|
+
&:active,
|
|
55
|
+
&:focus {
|
|
56
|
+
background-color: transparent;
|
|
57
|
+
border-color: transparent;
|
|
58
|
+
outline: none;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}
|
|
@@ -0,0 +1,172 @@
|
|
|
1
|
+
.ds.code-diff-viewer {
|
|
2
|
+
.hljs {
|
|
3
|
+
display: block;
|
|
4
|
+
overflow-x: auto;
|
|
5
|
+
padding: 0.5em;
|
|
6
|
+
|
|
7
|
+
color: #000000;
|
|
8
|
+
background: #0d1117;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.hljs-comment,
|
|
12
|
+
.hljs-prolog,
|
|
13
|
+
.hljs-doctype,
|
|
14
|
+
.hljs-cdata {
|
|
15
|
+
color: #8b949e;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.hljs-punctuation {
|
|
19
|
+
color: #000000;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.hljs-namespace {
|
|
23
|
+
opacity: 0.7;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.hljs-property,
|
|
27
|
+
.hljs-tag,
|
|
28
|
+
.hljs-boolean,
|
|
29
|
+
.hljs-number,
|
|
30
|
+
.hljs-constant,
|
|
31
|
+
.hljs-symbol,
|
|
32
|
+
.hljs-deleted {
|
|
33
|
+
color: #77216f;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.hljs-selector,
|
|
37
|
+
.hljs-attr-name,
|
|
38
|
+
.hljs-string,
|
|
39
|
+
.hljs-char,
|
|
40
|
+
.hljs-builtin,
|
|
41
|
+
.hljs-inserted {
|
|
42
|
+
color: #0e811f;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.hljs-operator,
|
|
46
|
+
.hljs-entity,
|
|
47
|
+
.hljs-url,
|
|
48
|
+
.language-css .hljs-string,
|
|
49
|
+
.style .hljs-string {
|
|
50
|
+
color: #a86500;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.hljs-atrule,
|
|
54
|
+
.hljs-attr-value,
|
|
55
|
+
.hljs-keyword {
|
|
56
|
+
color: #06c;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.hljs-function,
|
|
60
|
+
.hljs-class-name {
|
|
61
|
+
color: #c7162b;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.hljs-regexp,
|
|
65
|
+
.hljs-important,
|
|
66
|
+
.hljs-variable {
|
|
67
|
+
color: #dc3023;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.hljs-important,
|
|
71
|
+
.hljs-bold {
|
|
72
|
+
font-weight: bold;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.hljs-italic {
|
|
76
|
+
font-style: italic;
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
.hljs-entity {
|
|
80
|
+
cursor: help;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.hljs-attr,
|
|
84
|
+
.hljs-attribute,
|
|
85
|
+
.hljs-meta,
|
|
86
|
+
.hljs-selector-attr,
|
|
87
|
+
.hljs-selector-class,
|
|
88
|
+
.hljs-selector-id {
|
|
89
|
+
color: #77216f;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.hljs-variable,
|
|
93
|
+
.hljs-literal,
|
|
94
|
+
.hljs-number,
|
|
95
|
+
.hljs-doctag {
|
|
96
|
+
color: #77216f;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.hljs-params {
|
|
100
|
+
color: #000000;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
.hljs-class,
|
|
104
|
+
.hljs-tag,
|
|
105
|
+
.hljs-title,
|
|
106
|
+
.hljs-built_in {
|
|
107
|
+
color: #0e811f;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.hljs-keyword,
|
|
111
|
+
.hljs-type,
|
|
112
|
+
.hljs-builtin-name,
|
|
113
|
+
.hljs-meta-keyword,
|
|
114
|
+
.hljs-template-tag,
|
|
115
|
+
.hljs-template-variable {
|
|
116
|
+
color: #06c;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
.hljs-string,
|
|
120
|
+
.hljs-undefined {
|
|
121
|
+
color: #0e811f;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.hljs-regexp {
|
|
125
|
+
color: #dc3023;
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
.hljs-symbol {
|
|
129
|
+
color: #77216f;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.hljs-bullet {
|
|
133
|
+
color: #a86500;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
.hljs-section {
|
|
137
|
+
color: #77216f;
|
|
138
|
+
font-weight: bold;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
.hljs-quote,
|
|
142
|
+
.hljs-name,
|
|
143
|
+
.hljs-selector-tag,
|
|
144
|
+
.hljs-selector-pseudo {
|
|
145
|
+
color: #0e811f;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.hljs-emphasis {
|
|
149
|
+
color: #06c;
|
|
150
|
+
font-style: italic;
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
.hljs-strong {
|
|
154
|
+
color: #06c;
|
|
155
|
+
font-weight: bold;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.hljs-deletion {
|
|
159
|
+
color: #dc3023;
|
|
160
|
+
background-color: #490202;
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
.hljs-addition {
|
|
164
|
+
color: #0e811f;
|
|
165
|
+
background-color: #04260f;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.hljs-link {
|
|
169
|
+
color: #a86500;
|
|
170
|
+
font-style: underline;
|
|
171
|
+
}
|
|
172
|
+
}
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
/* @canonical/generator-canonical-ds 0.0.1 */
|
|
2
|
+
|
|
3
|
+
.ds.diff-line {
|
|
4
|
+
display: flex;
|
|
5
|
+
font-family: var(--font-family-mono);
|
|
6
|
+
min-width: var(--table-width);
|
|
7
|
+
color: var(--git-diff-viewer-code-default-color);
|
|
8
|
+
|
|
9
|
+
&.diff-line-add {
|
|
10
|
+
background-color: var(--git-diff-viewer-code-insertion-background);
|
|
11
|
+
|
|
12
|
+
td.diff-gutter {
|
|
13
|
+
background-color: var(--git-diff-viewer-code-insertion-background);
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
&.diff-line-context {
|
|
18
|
+
background-color: var(--git-diff-viewer-code-default-background);
|
|
19
|
+
|
|
20
|
+
td.diff-gutter {
|
|
21
|
+
background-color: var(--git-diff-viewer-code-default-background);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
&.diff-line-remove {
|
|
26
|
+
background-color: var(--git-diff-viewer-code-deletion-background);
|
|
27
|
+
|
|
28
|
+
td.diff-gutter {
|
|
29
|
+
background-color: var(--git-diff-viewer-code-deletion-background);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
&.diff-line-hunk {
|
|
34
|
+
background-color: var(--git-diff-viewer-hunk-header-background);
|
|
35
|
+
color: var(--git-diff-viewer-hunk-header-color);
|
|
36
|
+
user-select: none;
|
|
37
|
+
border-bottom: 1px solid var(--git-diff-viewer-border-color-tinted);
|
|
38
|
+
|
|
39
|
+
td.diff-gutter {
|
|
40
|
+
background-color: var(--git-diff-viewer-hunk-header-background);
|
|
41
|
+
border-color: var(--git-diff-viewer-border-color-tinted);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
td.diff-gutter {
|
|
46
|
+
min-width: var(--git-diff-viewer-gutter-width);
|
|
47
|
+
max-width: var(--git-diff-viewer-gutter-width);
|
|
48
|
+
padding: 0;
|
|
49
|
+
text-align: right;
|
|
50
|
+
border-right: 1px solid var(--git-diff-viewer-border-color-tinted);
|
|
51
|
+
user-select: none;
|
|
52
|
+
vertical-align: top;
|
|
53
|
+
|
|
54
|
+
&:not(.wrap) {
|
|
55
|
+
position: sticky;
|
|
56
|
+
left: 0;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.diff-line-numbers {
|
|
60
|
+
display: flex;
|
|
61
|
+
justify-content: space-between;
|
|
62
|
+
align-items: center;
|
|
63
|
+
padding: 0px;
|
|
64
|
+
}
|
|
65
|
+
.line-num {
|
|
66
|
+
display: inline-block;
|
|
67
|
+
width: calc(var(--git-diff-viewer-gutter-width) / 2 - 4px);
|
|
68
|
+
text-align: center;
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
td.diff-content {
|
|
73
|
+
/* padding: 0 0 0 calc(var(--git-diff-viewer-gutter-width) + 4px); */
|
|
74
|
+
padding: 0 0 0 4px;
|
|
75
|
+
|
|
76
|
+
&.wrap {
|
|
77
|
+
pre {
|
|
78
|
+
text-wrap: wrap;
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
pre {
|
|
83
|
+
margin: 0;
|
|
84
|
+
padding: 0 8px;
|
|
85
|
+
font-family: var(--font-family-mono);
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
&.interactive {
|
|
89
|
+
--icon-opacity: 0;
|
|
90
|
+
&:not(.diff-line-hunk) {
|
|
91
|
+
.diff-gutter {
|
|
92
|
+
cursor: pointer;
|
|
93
|
+
.diff-line-numbers::before {
|
|
94
|
+
content: var(--comment-icon);
|
|
95
|
+
display: inline-block;
|
|
96
|
+
width: var(--comment-icon-width);
|
|
97
|
+
opacity: var(--icon-opacity);
|
|
98
|
+
padding: 0 4px;
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
&:has(.diff-gutter:hover),
|
|
103
|
+
&:has(.diff-gutter:focus) {
|
|
104
|
+
filter: brightness(0.9);
|
|
105
|
+
}
|
|
106
|
+
&:has(.diff-gutter:hover) {
|
|
107
|
+
--icon-opacity: 1;
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/* @canonical/generator-canonical-ds 0.0.1 */
|
|
2
|
+
|
|
3
|
+
.ds.code-diff-viewer {
|
|
4
|
+
font-size: 13px;
|
|
5
|
+
.diff-table {
|
|
6
|
+
--comment-icon: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C12.7956 2 13.5587 2.31607 14.1213 2.87868C14.6839 3.44129 15 4.20435 15 5V10C15 10.6204 14.8076 11.2256 14.4495 11.7323C14.0913 12.2389 13.5849 12.622 13 12.829V16L8.5 13H4C3.20435 13 2.44129 12.6839 1.87868 12.1213C1.31607 11.5587 1 10.7956 1 10V5C1 4.20435 1.31607 3.44129 1.87868 2.87868C2.44129 2.31607 3.20435 2 4 2H12ZM12 3.5H4C3.62712 3.50002 3.26761 3.63892 2.99158 3.88962C2.71555 4.14032 2.5428 4.48484 2.507 4.856L2.5 5V10C2.50002 10.3729 2.63892 10.7324 2.88962 11.0084C3.14032 11.2844 3.48484 11.4572 3.856 11.493L4 11.5H8.954L11.5 13.196L11.501 11.768L12.501 11.415C13.049 11.221 13.436 10.725 13.493 10.146L13.5 10V5C13.5 4.62712 13.3611 4.26761 13.1104 3.99158C12.8597 3.71555 12.5152 3.5428 12.144 3.507L12 3.5ZM7.976 8.25V9.75H4.994V8.25H7.976ZM10.981 5.25V6.75H4.994V5.25H10.981Z" fill="currentColor"/></svg>');
|
|
7
|
+
--comment-icon-width: 16px;
|
|
8
|
+
|
|
9
|
+
/* updated dynamically on window resize */
|
|
10
|
+
--table-width: 300px;
|
|
11
|
+
|
|
12
|
+
table-layout: auto;
|
|
13
|
+
border-collapse: separate;
|
|
14
|
+
border-spacing: 1px 0;
|
|
15
|
+
display: block;
|
|
16
|
+
overflow: auto;
|
|
17
|
+
outline: none;
|
|
18
|
+
|
|
19
|
+
tr {
|
|
20
|
+
/* remove outer spacing from the sides of the table */
|
|
21
|
+
margin-left: -1px;
|
|
22
|
+
margin-right: -1px;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.line-decoration {
|
|
26
|
+
display: flex;
|
|
27
|
+
position: sticky;
|
|
28
|
+
left: 0;
|
|
29
|
+
width: var(--table-width);
|
|
30
|
+
.container {
|
|
31
|
+
width: 100%;
|
|
32
|
+
border: 1px solid var(--git-diff-viewer-border-color-tinted);
|
|
33
|
+
border-width: 1px 0;
|
|
34
|
+
border-radius: 1px;
|
|
35
|
+
padding: 0;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
/* @canonical/generator-canonical-ds 0.0.1 */
|
|
2
|
+
|
|
3
|
+
.ds.file-header {
|
|
4
|
+
display: flex;
|
|
5
|
+
align-items: center;
|
|
6
|
+
justify-content: space-between;
|
|
7
|
+
gap: var(--git-diff-file-header-items-gap);
|
|
8
|
+
background-color: var(--git-diff-file-header-background-color);
|
|
9
|
+
padding: var(--git-diff-file-header-vertical-padding)
|
|
10
|
+
var(--git-diff-file-header-horizontal-padding);
|
|
11
|
+
|
|
12
|
+
&:not(:has(.left-content > .collapse-button.collapsed)) {
|
|
13
|
+
border-bottom: 1px solid var(--git-diff-viewer-border-color-tinted);
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
& > .left-content,
|
|
17
|
+
& > .right-content {
|
|
18
|
+
display: flex;
|
|
19
|
+
align-items: center;
|
|
20
|
+
gap: var(--git-diff-file-header-items-gap);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
& > .left-content {
|
|
24
|
+
& > .file-name {
|
|
25
|
+
font-weight: 550;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
& > .collapse-button {
|
|
29
|
+
border: none;
|
|
30
|
+
background-color: var(--git-diff-file-header-button-background);
|
|
31
|
+
cursor: pointer;
|
|
32
|
+
padding: 4px;
|
|
33
|
+
margin: 0;
|
|
34
|
+
display: flex;
|
|
35
|
+
align-items: center;
|
|
36
|
+
border-radius: 1px;
|
|
37
|
+
|
|
38
|
+
&:hover {
|
|
39
|
+
background-color: var(--git-diff-file-header-button-hover-background);
|
|
40
|
+
}
|
|
41
|
+
&:focus {
|
|
42
|
+
background-color: var(--git-diff-file-header-button-focus-background);
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
&.collapsed {
|
|
46
|
+
transform: rotate(90deg);
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
& > .right-content {
|
|
52
|
+
& > .change-count {
|
|
53
|
+
font-size: 12px;
|
|
54
|
+
font-weight: 550;
|
|
55
|
+
line-height: 16px;
|
|
56
|
+
display: flex;
|
|
57
|
+
align-items: center;
|
|
58
|
+
|
|
59
|
+
& > .insertions,
|
|
60
|
+
& > .deletions {
|
|
61
|
+
padding: 0 4px;
|
|
62
|
+
display: flex;
|
|
63
|
+
align-items: center;
|
|
64
|
+
}
|
|
65
|
+
& > .insertions {
|
|
66
|
+
background-color: var(--git-diff-file-header-insertion-background);
|
|
67
|
+
color: var(--git-diff-file-header-insertion-color);
|
|
68
|
+
}
|
|
69
|
+
& > .deletions {
|
|
70
|
+
background-color: var(--git-diff-file-header-deletion-background);
|
|
71
|
+
color: var(--git-diff-file-header-deletion-color);
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}
|
package/dist/esm/ui/index.js
CHANGED
package/dist/esm/ui/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC"}
|
package/dist/types/ui/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@canonical/react-ds-app-launchpad",
|
|
3
|
-
"version": "0.9.0-experimental.
|
|
3
|
+
"version": "0.9.0-experimental.8",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"module": "dist/esm/index.js",
|
|
6
6
|
"types": "dist/types/index.d.ts",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"build": "bun run build:package",
|
|
25
25
|
"build:storybook": "storybook build",
|
|
26
26
|
"build:package": "bun run build:package:tsc && bun run build:package:copycss",
|
|
27
|
-
"build:package:copycss": "copyfiles -u 1 src/ui
|
|
27
|
+
"build:package:copycss": "copyfiles -u 1 'src/ui/{,**/}*.css' dist/esm",
|
|
28
28
|
"build:package:tsc": "tsc -p tsconfig.build.json",
|
|
29
29
|
"check": "bun run check:biome && bun run check:ts",
|
|
30
30
|
"check:fix": "bun run check:biome:fix && bun run check:ts",
|
|
@@ -69,5 +69,5 @@
|
|
|
69
69
|
"vite-tsconfig-paths": "^5.1.4",
|
|
70
70
|
"vitest": "^2.1.8"
|
|
71
71
|
},
|
|
72
|
-
"gitHead": "
|
|
72
|
+
"gitHead": "bb7aeae5a7ce05d425f225e3e04ea4b6ca81d440"
|
|
73
73
|
}
|