Skip to content

Commit 6bd6780

Browse files
melissaingmelissaing
authored
Merge branch 'patternfly:main' into pin-unpin
2 parents 91e7dcb + 62d4a0c commit 6bd6780

9 files changed

Lines changed: 19 additions & 69 deletions

File tree

‎packages/module/src/Chatbot/Chatbot.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
flex-direction: column;
1010
width: 30rem;
1111
height: 70vh;
12-
background-color: var(--pf-t--chatbot--background);
12+
background-color: var(--pf-t--global--background--color--secondary--default);
1313
border-radius: var(--pf-t--global--border--radius--medium);
1414
box-shadow: var(--pf-t--global--box-shadow--lg);
1515
font-size: var(--pf-t--global--font--size--md);

‎packages/module/src/ChatbotContent/ChatbotContent.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
// ============================================================================
44
.pf-chatbot__content {
55
position: relative;
6-
background-color: var(--pf-t--chatbot--background);
6+
background-color: var(--pf-t--global--background--color--secondary--default);
77
overflow-y: auto;
88
overflow: hidden; // needed in Red Hat Developer Hub workspace
99
flex: 1; // needed in Composer AI

‎packages/module/src/ChatbotFooter/ChatbotFooter.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
// ============================================================================
77
.pf-chatbot__footer {
88
--pf-chatbot__footer--RowGap: var(--pf-t--global--spacer--md);
9-
background-color: var(--pf-t--chatbot--background);
9+
background-color: var(--pf-t--global--background--color--secondary--default);
1010
display: flex;
1111
flex-direction: column;
1212
row-gap: var(--pf-chatbot__footer--RowGap);

‎packages/module/src/ChatbotHeader/ChatbotHeader.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
grid-template-columns: 1fr auto;
1010
gap: var(--pf-t--global--spacer--sm);
1111
position: relative; // this is so focus ring on parent chatbot doesn't include header
12-
background-color: var(--pf-t--chatbot--background);
12+
background-color: var(--pf-t--global--background--color--secondary--default);
1313
justify-content: space-between;
1414
padding: var(--pf-t--global--spacer--lg);
1515

@@ -76,7 +76,7 @@
7676
.pf-chatbot--drawer,
7777
.pf-chatbot--docked {
7878
.pf-chatbot__header {
79-
background-color: var(--pf-t--chatbot--background);
79+
background-color: var(--pf-t--global--background--color--secondary--default);
8080
}
8181
}
8282

‎packages/module/src/ChatbotToggle/ChatbotToggle.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,12 @@
66
inset-block-end: var(--pf-t--global--spacer--md);
77
inset-inline-end: var(--pf-t--global--spacer--md);
88
background-color: var(--pf-t--global--background--color--inverse--default);
9-
--pf-v6-c-button__icon--Color: var(--pf-t--chatbot-toggle--color);
9+
--pf-v6-c-button__icon--Color: var(--pf-t--global--icon--color--inverse);
1010
padding: var(--pf-t--global--spacer--md);
1111

1212
&:hover,
1313
&:focus {
14-
background-color: var(--pf-t--chatbot-toggle--background--hover);
14+
background-color: var(--pf-t--color--gray--70);
1515
}
1616

1717
.pf-v6-c-button__icon {

‎packages/module/src/Message/Message.scss‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -48,20 +48,22 @@
4848

4949
// Author name
5050
.pf-chatbot__message-name {
51-
font-family: var(--pf-t--chatbot--heading--font-family);
51+
font-family: var(
52+
--pf-v6-c-content--heading--FontFamily,
53+
redhatdisplayvf,
54+
redhatdisplay,
55+
helvetica,
56+
arial,
57+
sans-serif
58+
);
5259
font-weight: 600;
5360
font-size: var(--pf-t--global--font--size--sm);
5461
}
5562

5663
// Badge
5764
.pf-v6-c-label {
58-
--pf-v6-c-label--m-outline--BorderColor: var(--pf-t--global--border--color--on-secondary);
5965
--pf-v6-c-label--FontSize: var(--pf-t--global--font--size--xs);
6066
font-weight: var(--pf-t--global--font--weight--body--bold);
61-
62-
.pf-v6-c-label__content {
63-
--pf-v6-c-label--Color: var(--pf-t--global--border--color--on-secondary);
64-
}
6567
}
6668

6769
// Timestamp

‎packages/module/src/MessageBar/SendButton.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,11 @@
1313

1414
&:hover,
1515
&:focus {
16-
background-color: var(--pf-t--chatbot--blue-icon--background--color--hover);
16+
background-color: rgba(146, 197, 249, 0.25); // --pf-t--global--color--nonstatus--blue--default @ 25%;
1717
color: var(--pf-t--global--color--brand--hover);
1818

1919
.pf-v6-c-button__icon {
20-
color: var(--pf-t--chatbot--blue-icon--fill--hover);
20+
color: var(--pf-t--global--color--brand--hover);
2121
}
2222
}
2323
}
@@ -37,7 +37,7 @@
3737

3838
.pf-v6-c-button.pf-chatbot__button--send:hover,
3939
.pf-v6-c-button.pf-chatbot__button--send:focus {
40-
background-color: var(--pf-t--chatbot--blue-icon--background--color--hover);
40+
background-color: rgba(146, 197, 249, 0.25); // --pf-t--global--color--nonstatus--blue--default @ 25%;
4141
}
4242
}
4343

‎packages/module/src/MessageBox/JumpButton.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
border-radius: var(--pf-t--global--border--radius--pill) !important;
1515
--pf-v6-c-button--MinWidth: 2rem !important;
1616
background-color: var(--pf-t--global--background--color--primary--default) !important;
17-
border: 1px solid var(--pf-t--chatbot--border) !important;
17+
border: 1px solid var(--pf-t--global--border--color--default) !important;
1818
box-shadow: var(--pf-t--global--box-shadow--sm);
1919
color: var(--pf-t--global--icon--color--subtle) !important;
2020
transform: translate3d(-50%, 0, 0) !important;

‎packages/module/src/main.scss‎

Lines changed: 0 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -33,58 +33,6 @@
3333
@import './SourceDetailsMenuItem/SourceDetailsMenuItem';
3434
@import './TermsOfUse/TermsOfUse';
3535

36-
:where(:root) {
37-
// ============================================================================
38-
// Chatbot Custom Default Tokens
39-
// ============================================================================
40-
41-
--pf-t--chatbot--heading--font-family: var(
42-
--pf-v6-c-content--heading--FontFamily,
43-
redhatdisplayvf,
44-
redhatdisplay,
45-
helvetica,
46-
arial,
47-
sans-serif
48-
);
49-
50-
--pf-t--chatbot--illustration--fill: var(--pf-t--color--red--50);
51-
--pf-t--chatbot--code--background: var(--pf-t--color--gray--20);
52-
53-
--pf-t--chatbot-toggle--background--hover: var(--pf-t--color--gray--70);
54-
55-
--pf-t--chatbot--blue-icon--background--color--hover: rgba(
56-
146,
57-
197,
58-
249,
59-
0.25
60-
); // --pf-t--global--color--nonstatus--blue--default @ 25%
61-
--pf-t--chatbot--blue-icon--fill--hover: var(--pf-t--global--color--brand--hover);
62-
63-
// ============================================================================
64-
// Chatbot Default tokens using PF semantic tokens
65-
// ============================================================================
66-
--pf-t--chatbot-toggle--color: var(--pf-t--global--icon--color--inverse);
67-
--pf-t--chatbot--background: var(--pf-t--global--background--color--secondary--default);
68-
--pf-t--chatbot--border: var(--pf-t--global--border--color--default);
69-
70-
--pf-t--chatbot--icon--fill--active: var(--pf-t--global--text--color--regular);
71-
72-
--pf-t--chatbot--blue-icon--fill: var(--pf-t--global--color--brand--default);
73-
}
74-
75-
// ============================================================================
76-
// Chatbot Custom Dark Theme Tokens
77-
// ============================================================================
78-
:where(.pf-v6-theme-dark) {
79-
--pf-t--chatbot--illustration--fill: var(--pf-t--color--white);
80-
--pf-t--chatbot--code--background: var(--pf-t--color--gray--60);
81-
82-
--pf-t--chatbot-toggle--background--hover: var(--pf-t--color--gray--20);
83-
84-
--pf-t--chatbot--blue-icon--background--color--hover: var(--pf-t--global--color--brand--hover);
85-
--pf-t--chatbot--blue-icon--fill--hover: var(--pf-t--global--icon--color--inverse);
86-
}
87-
8836
.ws-full-page-utils {
8937
left: 0 !important;
9038
right: auto !important;

0 commit comments

Comments
 (0)