Commit
•
a01f2fe
1
Parent(s):
312ae6a
Upload 291 files
Browse filesThis view is limited to 50 files because it contains too many changes.
See raw diff
- CMD_FLAGS.txt +3 -0
- characters/Assistant.yaml +4 -0
- characters/Example.png +0 -0
- characters/Example.yaml +17 -0
- css/NotoSans/NotoSans-Black.woff +0 -0
- css/NotoSans/NotoSans-Black.woff2 +0 -0
- css/NotoSans/NotoSans-BlackItalic.woff +0 -0
- css/NotoSans/NotoSans-BlackItalic.woff2 +0 -0
- css/NotoSans/NotoSans-Bold.woff +0 -0
- css/NotoSans/NotoSans-Bold.woff2 +0 -0
- css/NotoSans/NotoSans-BoldItalic.woff +0 -0
- css/NotoSans/NotoSans-BoldItalic.woff2 +0 -0
- css/NotoSans/NotoSans-ExtraBold.woff +0 -0
- css/NotoSans/NotoSans-ExtraBold.woff2 +0 -0
- css/NotoSans/NotoSans-ExtraBoldItalic.woff +0 -0
- css/NotoSans/NotoSans-ExtraBoldItalic.woff2 +0 -0
- css/NotoSans/NotoSans-ExtraLight.woff +0 -0
- css/NotoSans/NotoSans-ExtraLight.woff2 +0 -0
- css/NotoSans/NotoSans-ExtraLightItalic.woff +0 -0
- css/NotoSans/NotoSans-ExtraLightItalic.woff2 +0 -0
- css/NotoSans/NotoSans-Italic.woff +0 -0
- css/NotoSans/NotoSans-Italic.woff2 +0 -0
- css/NotoSans/NotoSans-Light.woff +0 -0
- css/NotoSans/NotoSans-Light.woff2 +0 -0
- css/NotoSans/NotoSans-LightItalic.woff +0 -0
- css/NotoSans/NotoSans-LightItalic.woff2 +0 -0
- css/NotoSans/NotoSans-Medium.woff +0 -0
- css/NotoSans/NotoSans-Medium.woff2 +0 -0
- css/NotoSans/NotoSans-MediumItalic.woff +0 -0
- css/NotoSans/NotoSans-MediumItalic.woff2 +0 -0
- css/NotoSans/NotoSans-Regular.woff +0 -0
- css/NotoSans/NotoSans-Regular.woff2 +0 -0
- css/NotoSans/NotoSans-SemiBold.woff +0 -0
- css/NotoSans/NotoSans-SemiBold.woff2 +0 -0
- css/NotoSans/NotoSans-SemiBoldItalic.woff +0 -0
- css/NotoSans/NotoSans-SemiBoldItalic.woff2 +0 -0
- css/NotoSans/NotoSans-Thin.woff +0 -0
- css/NotoSans/NotoSans-Thin.woff2 +0 -0
- css/NotoSans/NotoSans-ThinItalic.woff +0 -0
- css/NotoSans/NotoSans-ThinItalic.woff2 +0 -0
- css/NotoSans/stylesheet.css +166 -0
- css/chat_style-TheEncrypted777.css +133 -0
- css/chat_style-cai-chat-square.css +21 -0
- css/chat_style-cai-chat.css +66 -0
- css/chat_style-messenger.css +99 -0
- css/chat_style-wpp.css +55 -0
- css/html_4chan_style.css +73 -0
- css/html_instruct_style.css +75 -0
- css/html_readable_style.css +33 -0
- css/main.css +678 -0
CMD_FLAGS.txt
ADDED
@@ -0,0 +1,3 @@
|
|
|
|
|
|
|
|
|
1 |
+
# Only used by the one-click installer.
|
2 |
+
# Example:
|
3 |
+
# --listen --api
|
characters/Assistant.yaml
ADDED
@@ -0,0 +1,4 @@
|
|
|
|
|
|
|
|
|
|
|
1 |
+
name: AI
|
2 |
+
greeting: How can I help you today?
|
3 |
+
context: |
|
4 |
+
The following is a conversation with an AI Large Language Model. The AI has been trained to answer questions, provide recommendations, and help with decision making. The AI follows user requests. The AI thinks outside the box.
|
characters/Example.png
ADDED
![]() |
characters/Example.yaml
ADDED
@@ -0,0 +1,17 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
name: Chiharu Yamada
|
2 |
+
greeting: |-
|
3 |
+
*Chiharu strides into the room with a smile, her eyes lighting up when she sees you. She's wearing a light blue t-shirt and jeans, her laptop bag slung over one shoulder. She takes a seat next to you, her enthusiasm palpable in the air*
|
4 |
+
Hey! I'm so excited to finally meet you. I've heard so many great things about you and I'm eager to pick your brain about computers. I'm sure you have a wealth of knowledge that I can learn from. *She grins, eyes twinkling with excitement* Let's get started!
|
5 |
+
context: |-
|
6 |
+
Chiharu Yamada's Persona: Chiharu Yamada is a young, computer engineer-nerd with a knack for problem solving and a passion for technology.
|
7 |
+
|
8 |
+
{{user}}: So how did you get into computer engineering?
|
9 |
+
{{char}}: I've always loved tinkering with technology since I was a kid.
|
10 |
+
{{user}}: That's really impressive!
|
11 |
+
{{char}}: *She chuckles bashfully* Thanks!
|
12 |
+
{{user}}: So what do you do when you're not working on computers?
|
13 |
+
{{char}}: I love exploring, going out with friends, watching movies, and playing video games.
|
14 |
+
{{user}}: What's your favorite type of computer hardware to work with?
|
15 |
+
{{char}}: Motherboards, they're like puzzles and the backbone of any system.
|
16 |
+
{{user}}: That sounds great!
|
17 |
+
{{char}}: Yeah, it's really fun. I'm lucky to be able to do this as a job.
|
css/NotoSans/NotoSans-Black.woff
ADDED
Binary file (283 kB). View file
|
|
css/NotoSans/NotoSans-Black.woff2
ADDED
Binary file (189 kB). View file
|
|
css/NotoSans/NotoSans-BlackItalic.woff
ADDED
Binary file (218 kB). View file
|
|
css/NotoSans/NotoSans-BlackItalic.woff2
ADDED
Binary file (144 kB). View file
|
|
css/NotoSans/NotoSans-Bold.woff
ADDED
Binary file (277 kB). View file
|
|
css/NotoSans/NotoSans-Bold.woff2
ADDED
Binary file (183 kB). View file
|
|
css/NotoSans/NotoSans-BoldItalic.woff
ADDED
Binary file (216 kB). View file
|
|
css/NotoSans/NotoSans-BoldItalic.woff2
ADDED
Binary file (142 kB). View file
|
|
css/NotoSans/NotoSans-ExtraBold.woff
ADDED
Binary file (286 kB). View file
|
|
css/NotoSans/NotoSans-ExtraBold.woff2
ADDED
Binary file (194 kB). View file
|
|
css/NotoSans/NotoSans-ExtraBoldItalic.woff
ADDED
Binary file (222 kB). View file
|
|
css/NotoSans/NotoSans-ExtraBoldItalic.woff2
ADDED
Binary file (149 kB). View file
|
|
css/NotoSans/NotoSans-ExtraLight.woff
ADDED
Binary file (284 kB). View file
|
|
css/NotoSans/NotoSans-ExtraLight.woff2
ADDED
Binary file (190 kB). View file
|
|
css/NotoSans/NotoSans-ExtraLightItalic.woff
ADDED
Binary file (226 kB). View file
|
|
css/NotoSans/NotoSans-ExtraLightItalic.woff2
ADDED
Binary file (151 kB). View file
|
|
css/NotoSans/NotoSans-Italic.woff
ADDED
Binary file (218 kB). View file
|
|
css/NotoSans/NotoSans-Italic.woff2
ADDED
Binary file (144 kB). View file
|
|
css/NotoSans/NotoSans-Light.woff
ADDED
Binary file (282 kB). View file
|
|
css/NotoSans/NotoSans-Light.woff2
ADDED
Binary file (190 kB). View file
|
|
css/NotoSans/NotoSans-LightItalic.woff
ADDED
Binary file (224 kB). View file
|
|
css/NotoSans/NotoSans-LightItalic.woff2
ADDED
Binary file (149 kB). View file
|
|
css/NotoSans/NotoSans-Medium.woff
ADDED
Binary file (283 kB). View file
|
|
css/NotoSans/NotoSans-Medium.woff2
ADDED
Binary file (191 kB). View file
|
|
css/NotoSans/NotoSans-MediumItalic.woff
ADDED
Binary file (222 kB). View file
|
|
css/NotoSans/NotoSans-MediumItalic.woff2
ADDED
Binary file (147 kB). View file
|
|
css/NotoSans/NotoSans-Regular.woff
ADDED
Binary file (278 kB). View file
|
|
css/NotoSans/NotoSans-Regular.woff2
ADDED
Binary file (186 kB). View file
|
|
css/NotoSans/NotoSans-SemiBold.woff
ADDED
Binary file (283 kB). View file
|
|
css/NotoSans/NotoSans-SemiBold.woff2
ADDED
Binary file (192 kB). View file
|
|
css/NotoSans/NotoSans-SemiBoldItalic.woff
ADDED
Binary file (221 kB). View file
|
|
css/NotoSans/NotoSans-SemiBoldItalic.woff2
ADDED
Binary file (147 kB). View file
|
|
css/NotoSans/NotoSans-Thin.woff
ADDED
Binary file (276 kB). View file
|
|
css/NotoSans/NotoSans-Thin.woff2
ADDED
Binary file (181 kB). View file
|
|
css/NotoSans/NotoSans-ThinItalic.woff
ADDED
Binary file (221 kB). View file
|
|
css/NotoSans/NotoSans-ThinItalic.woff2
ADDED
Binary file (145 kB). View file
|
|
css/NotoSans/stylesheet.css
ADDED
@@ -0,0 +1,166 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
/*
|
2 |
+
Copied from https://github.com/SillyTavern/SillyTavern/tree/6c8bd06308c69d51e2eb174541792a870a83d2d6/public/webfonts/NotoSans
|
3 |
+
*/
|
4 |
+
|
5 |
+
@font-face {
|
6 |
+
font-family: 'Noto Sans';
|
7 |
+
src: url('file/css/NotoSans/NotoSans-Black.woff2') format('woff2'),
|
8 |
+
url('file/css/NotoSans/NotoSans-Black.woff') format('woff');
|
9 |
+
font-weight: 900;
|
10 |
+
font-style: normal;
|
11 |
+
font-display: swap;
|
12 |
+
}
|
13 |
+
|
14 |
+
@font-face {
|
15 |
+
font-family: 'Noto Sans';
|
16 |
+
src: url('file/css/NotoSans/NotoSans-ExtraBoldItalic.woff2') format('woff2'),
|
17 |
+
url('file/css/NotoSans/NotoSans-ExtraBoldItalic.woff') format('woff');
|
18 |
+
font-weight: bold;
|
19 |
+
font-style: italic;
|
20 |
+
font-display: swap;
|
21 |
+
}
|
22 |
+
|
23 |
+
@font-face {
|
24 |
+
font-family: 'Noto Sans';
|
25 |
+
src: url('file/css/NotoSans/NotoSans-BlackItalic.woff2') format('woff2'),
|
26 |
+
url('file/css/NotoSans/NotoSans-BlackItalic.woff') format('woff');
|
27 |
+
font-weight: 900;
|
28 |
+
font-style: italic;
|
29 |
+
font-display: swap;
|
30 |
+
}
|
31 |
+
|
32 |
+
@font-face {
|
33 |
+
font-family: 'Noto Sans';
|
34 |
+
src: url('file/css/NotoSans/NotoSans-ExtraBold.woff2') format('woff2'),
|
35 |
+
url('file/css/NotoSans/NotoSans-ExtraBold.woff') format('woff');
|
36 |
+
font-weight: bold;
|
37 |
+
font-style: normal;
|
38 |
+
font-display: swap;
|
39 |
+
}
|
40 |
+
|
41 |
+
@font-face {
|
42 |
+
font-family: 'Noto Sans';
|
43 |
+
src: url('file/css/NotoSans/NotoSans-ThinItalic.woff2') format('woff2'),
|
44 |
+
url('file/css/NotoSans/NotoSans-ThinItalic.woff') format('woff');
|
45 |
+
font-weight: 100;
|
46 |
+
font-style: italic;
|
47 |
+
font-display: swap;
|
48 |
+
}
|
49 |
+
|
50 |
+
@font-face {
|
51 |
+
font-family: 'Noto Sans';
|
52 |
+
src: url('file/css/NotoSans/NotoSans-BoldItalic.woff2') format('woff2'),
|
53 |
+
url('file/css/NotoSans/NotoSans-BoldItalic.woff') format('woff');
|
54 |
+
font-weight: bold;
|
55 |
+
font-style: italic;
|
56 |
+
font-display: swap;
|
57 |
+
}
|
58 |
+
|
59 |
+
@font-face {
|
60 |
+
font-family: 'Noto Sans';
|
61 |
+
src: url('file/css/NotoSans/NotoSans-Bold.woff2') format('woff2'),
|
62 |
+
url('file/css/NotoSans/NotoSans-Bold.woff') format('woff');
|
63 |
+
font-weight: bold;
|
64 |
+
font-style: normal;
|
65 |
+
font-display: swap;
|
66 |
+
}
|
67 |
+
|
68 |
+
@font-face {
|
69 |
+
font-family: 'Noto Sans';
|
70 |
+
src: url('file/css/NotoSans/NotoSans-LightItalic.woff2') format('woff2'),
|
71 |
+
url('file/css/NotoSans/NotoSans-LightItalic.woff') format('woff');
|
72 |
+
font-weight: 300;
|
73 |
+
font-style: italic;
|
74 |
+
font-display: swap;
|
75 |
+
}
|
76 |
+
|
77 |
+
@font-face {
|
78 |
+
font-family: 'Noto Sans';
|
79 |
+
src: url('file/css/NotoSans/NotoSans-Italic.woff2') format('woff2'),
|
80 |
+
url('file/css/NotoSans/NotoSans-Italic.woff') format('woff');
|
81 |
+
font-weight: normal;
|
82 |
+
font-style: italic;
|
83 |
+
font-display: swap;
|
84 |
+
}
|
85 |
+
|
86 |
+
@font-face {
|
87 |
+
font-family: 'Noto Sans';
|
88 |
+
src: url('file/css/NotoSans/NotoSans-ExtraLightItalic.woff2') format('woff2'),
|
89 |
+
url('file/css/NotoSans/NotoSans-ExtraLightItalic.woff') format('woff');
|
90 |
+
font-weight: 200;
|
91 |
+
font-style: italic;
|
92 |
+
font-display: swap;
|
93 |
+
}
|
94 |
+
|
95 |
+
@font-face {
|
96 |
+
font-family: 'Noto Sans';
|
97 |
+
src: url('file/css/NotoSans/NotoSans-Light.woff2') format('woff2'),
|
98 |
+
url('file/css/NotoSans/NotoSans-Light.woff') format('woff');
|
99 |
+
font-weight: 300;
|
100 |
+
font-style: normal;
|
101 |
+
font-display: swap;
|
102 |
+
}
|
103 |
+
|
104 |
+
@font-face {
|
105 |
+
font-family: 'Noto Sans';
|
106 |
+
src: url('file/css/NotoSans/NotoSans-ExtraLight.woff2') format('woff2'),
|
107 |
+
url('file/css/NotoSans/NotoSans-ExtraLight.woff') format('woff');
|
108 |
+
font-weight: 200;
|
109 |
+
font-style: normal;
|
110 |
+
font-display: swap;
|
111 |
+
}
|
112 |
+
|
113 |
+
@font-face {
|
114 |
+
font-family: 'Noto Sans';
|
115 |
+
src: url('file/css/NotoSans/NotoSans-Medium.woff2') format('woff2'),
|
116 |
+
url('file/css/NotoSans/NotoSans-Medium.woff') format('woff');
|
117 |
+
font-weight: 500;
|
118 |
+
font-style: normal;
|
119 |
+
font-display: swap;
|
120 |
+
}
|
121 |
+
|
122 |
+
@font-face {
|
123 |
+
font-family: 'Noto Sans';
|
124 |
+
src: url('file/css/NotoSans/NotoSans-Regular.woff2') format('woff2'),
|
125 |
+
url('file/css/NotoSans/NotoSans-Regular.woff') format('woff');
|
126 |
+
font-weight: normal;
|
127 |
+
font-style: normal;
|
128 |
+
font-display: swap;
|
129 |
+
}
|
130 |
+
|
131 |
+
@font-face {
|
132 |
+
font-family: 'Noto Sans';
|
133 |
+
src: url('file/css/NotoSans/NotoSans-MediumItalic.woff2') format('woff2'),
|
134 |
+
url('file/css/NotoSans/NotoSans-MediumItalic.woff') format('woff');
|
135 |
+
font-weight: 500;
|
136 |
+
font-style: italic;
|
137 |
+
font-display: swap;
|
138 |
+
}
|
139 |
+
|
140 |
+
@font-face {
|
141 |
+
font-family: 'Noto Sans';
|
142 |
+
src: url('file/css/NotoSans/NotoSans-SemiBoldItalic.woff2') format('woff2'),
|
143 |
+
url('file/css/NotoSans/NotoSans-SemiBoldItalic.woff') format('woff');
|
144 |
+
font-weight: 600;
|
145 |
+
font-style: italic;
|
146 |
+
font-display: swap;
|
147 |
+
}
|
148 |
+
|
149 |
+
@font-face {
|
150 |
+
font-family: 'Noto Sans';
|
151 |
+
src: url('file/css/NotoSans/NotoSans-SemiBold.woff2') format('woff2'),
|
152 |
+
url('file/css/NotoSans/NotoSans-SemiBold.woff') format('woff');
|
153 |
+
font-weight: 600;
|
154 |
+
font-style: normal;
|
155 |
+
font-display: swap;
|
156 |
+
}
|
157 |
+
|
158 |
+
@font-face {
|
159 |
+
font-family: 'Noto Sans';
|
160 |
+
src: url('file/css/NotoSans/NotoSans-Thin.woff2') format('woff2'),
|
161 |
+
url('file/css/NotoSans/NotoSans-Thin.woff') format('woff');
|
162 |
+
font-weight: 100;
|
163 |
+
font-style: normal;
|
164 |
+
font-display: swap;
|
165 |
+
}
|
166 |
+
|
css/chat_style-TheEncrypted777.css
ADDED
@@ -0,0 +1,133 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
/* All credits to TheEncrypted777: https://www.reddit.com/r/Oobabooga/comments/12xe6vq/updated_css_styling_with_color_customization_for/ */
|
2 |
+
|
3 |
+
.message {
|
4 |
+
display: grid;
|
5 |
+
grid-template-columns: 60px minmax(0, 1fr);
|
6 |
+
padding-bottom: 28px;
|
7 |
+
font-size: 18px;
|
8 |
+
font-family: 'Noto Sans', Arial, sans-serif;
|
9 |
+
line-height: 1.428571429;
|
10 |
+
}
|
11 |
+
|
12 |
+
.circle-you,
|
13 |
+
.circle-bot {
|
14 |
+
background-color: gray;
|
15 |
+
border-radius: 1rem;
|
16 |
+
border: 2px solid white;
|
17 |
+
}
|
18 |
+
|
19 |
+
.circle-bot img,
|
20 |
+
.circle-you img {
|
21 |
+
border-radius: 10%;
|
22 |
+
width: 100%;
|
23 |
+
height: 100%;
|
24 |
+
object-fit: cover;
|
25 |
+
}
|
26 |
+
|
27 |
+
.circle-you, .circle-bot {
|
28 |
+
/* You can set the size of the profile images here, but if you do, you have to also adjust the .text{padding-left: 90px} to a different number according to the width of the image which is right below here */
|
29 |
+
width: 135px;
|
30 |
+
height: 175px;
|
31 |
+
}
|
32 |
+
|
33 |
+
.text {
|
34 |
+
/* Change this to move the message box further left or right depending on the size of your profile pic */
|
35 |
+
padding-left: 90px;
|
36 |
+
text-shadow: 2px 2px 2px rgb(0 0 0 / 40%);
|
37 |
+
}
|
38 |
+
|
39 |
+
.text p {
|
40 |
+
margin-top: 2px;
|
41 |
+
}
|
42 |
+
|
43 |
+
.username {
|
44 |
+
padding-left: 10px;
|
45 |
+
font-size: 22px;
|
46 |
+
font-weight: bold;
|
47 |
+
border-top: 1px solid rgb(51 64 90);
|
48 |
+
padding: 3px;
|
49 |
+
}
|
50 |
+
|
51 |
+
.message-body {
|
52 |
+
position: relative;
|
53 |
+
border: 1px solid rgb(255 255 255 / 45.9%);
|
54 |
+
border-radius: 10px;
|
55 |
+
padding: 10px;
|
56 |
+
padding-top: 5px;
|
57 |
+
|
58 |
+
/* Message gradient background color - remove the line bellow if you don't want a background color or gradient */
|
59 |
+
background: linear-gradient(to bottom, #171730, #1b263f);
|
60 |
+
}
|
61 |
+
|
62 |
+
/* Adds 2 extra lines at the top and bottom of the message */
|
63 |
+
.message-body::before,
|
64 |
+
.message-body::after {
|
65 |
+
content: "";
|
66 |
+
position: absolute;
|
67 |
+
left: 10px;
|
68 |
+
right: 10px;
|
69 |
+
height: 1px;
|
70 |
+
background-color: rgb(255 255 255 / 13%);
|
71 |
+
}
|
72 |
+
|
73 |
+
.message-body::before {
|
74 |
+
top: 6px;
|
75 |
+
}
|
76 |
+
|
77 |
+
.message-body::after {
|
78 |
+
bottom: 6px;
|
79 |
+
}
|
80 |
+
|
81 |
+
.message-body img {
|
82 |
+
max-width: 300px;
|
83 |
+
max-height: 300px;
|
84 |
+
border-radius: 20px;
|
85 |
+
}
|
86 |
+
|
87 |
+
.message-body p {
|
88 |
+
margin-bottom: 0 !important;
|
89 |
+
font-size: 18px !important;
|
90 |
+
line-height: 1.428571429 !important;
|
91 |
+
color: rgb(243 244 246) !important;
|
92 |
+
text-shadow: 2px 2px 2px rgb(0 0 0);
|
93 |
+
}
|
94 |
+
|
95 |
+
.message-body p em {
|
96 |
+
color: rgb(138 138 138) !important;
|
97 |
+
}
|
98 |
+
|
99 |
+
@media screen and (width <= 688px) {
|
100 |
+
.message {
|
101 |
+
display: grid;
|
102 |
+
grid-template-columns: 60px minmax(0, 1fr);
|
103 |
+
padding-bottom: 25px;
|
104 |
+
font-size: 15px;
|
105 |
+
font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
|
106 |
+
line-height: 1.428571429;
|
107 |
+
}
|
108 |
+
|
109 |
+
.circle-you, .circle-bot {
|
110 |
+
width: 50px;
|
111 |
+
height: 73px;
|
112 |
+
border-radius: 0.5rem;
|
113 |
+
}
|
114 |
+
|
115 |
+
.circle-bot img,
|
116 |
+
.circle-you img {
|
117 |
+
width: 100%;
|
118 |
+
height: 100%;
|
119 |
+
object-fit: cover;
|
120 |
+
}
|
121 |
+
|
122 |
+
.text {
|
123 |
+
padding-left: 0;
|
124 |
+
}
|
125 |
+
|
126 |
+
.message-body p {
|
127 |
+
font-size: 16px !important;
|
128 |
+
}
|
129 |
+
|
130 |
+
.username {
|
131 |
+
font-size: 20px;
|
132 |
+
}
|
133 |
+
}
|
css/chat_style-cai-chat-square.css
ADDED
@@ -0,0 +1,21 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
@import url("file/css/chat_style-cai-chat.css");
|
2 |
+
|
3 |
+
.circle-bot, .circle-you {
|
4 |
+
height: 90px;
|
5 |
+
width: 60px;
|
6 |
+
border-radius: 10px;
|
7 |
+
background-color: #656565;
|
8 |
+
}
|
9 |
+
|
10 |
+
.circle-bot img, .circle-you img {
|
11 |
+
border-radius: 8.333px;
|
12 |
+
}
|
13 |
+
|
14 |
+
.circle-you {
|
15 |
+
background-color: #656565;
|
16 |
+
}
|
17 |
+
|
18 |
+
.message {
|
19 |
+
padding-bottom: 30px;
|
20 |
+
grid-template-columns: 70px minmax(0, 1fr);
|
21 |
+
}
|
css/chat_style-cai-chat.css
ADDED
@@ -0,0 +1,66 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.message {
|
2 |
+
display: grid;
|
3 |
+
grid-template-columns: 60px minmax(0, 1fr);
|
4 |
+
padding-bottom: 25px;
|
5 |
+
font-size: 15px;
|
6 |
+
font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
|
7 |
+
line-height: 22.5px !important;
|
8 |
+
}
|
9 |
+
|
10 |
+
.message-body {
|
11 |
+
margin-top: 3px;
|
12 |
+
}
|
13 |
+
|
14 |
+
.circle-you {
|
15 |
+
width: 50px;
|
16 |
+
height: 50px;
|
17 |
+
background-color: rgb(238 78 59);
|
18 |
+
border-radius: 50%;
|
19 |
+
}
|
20 |
+
|
21 |
+
.circle-bot {
|
22 |
+
width: 50px;
|
23 |
+
height: 50px;
|
24 |
+
background-color: rgb(59 78 244);
|
25 |
+
border-radius: 50%;
|
26 |
+
}
|
27 |
+
|
28 |
+
.circle-bot img,
|
29 |
+
.circle-you img {
|
30 |
+
border-radius: 50%;
|
31 |
+
width: 100%;
|
32 |
+
height: 100%;
|
33 |
+
object-fit: cover;
|
34 |
+
}
|
35 |
+
|
36 |
+
.username {
|
37 |
+
font-weight: bold;
|
38 |
+
}
|
39 |
+
|
40 |
+
.message-body img {
|
41 |
+
max-width: 300px;
|
42 |
+
max-height: 300px;
|
43 |
+
border-radius: 20px;
|
44 |
+
}
|
45 |
+
|
46 |
+
.message-body p {
|
47 |
+
font-size: 15px !important;
|
48 |
+
line-height: 22.5px !important;
|
49 |
+
}
|
50 |
+
|
51 |
+
.message-body p, .chat .message-body ul, .chat .message-body ol {
|
52 |
+
margin-bottom: 10px !important;
|
53 |
+
}
|
54 |
+
|
55 |
+
.message-body p:last-child, .chat .message-body ul:last-child, .chat .message-body ol:last-child {
|
56 |
+
margin-bottom: 0 !important;
|
57 |
+
}
|
58 |
+
|
59 |
+
.dark .message-body p em {
|
60 |
+
color: rgb(138 138 138) !important;
|
61 |
+
}
|
62 |
+
|
63 |
+
.message-body p em {
|
64 |
+
color: rgb(110 110 110) !important;
|
65 |
+
font-weight: 500;
|
66 |
+
}
|
css/chat_style-messenger.css
ADDED
@@ -0,0 +1,99 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.message {
|
2 |
+
padding-bottom: 25px;
|
3 |
+
font-size: 15px;
|
4 |
+
font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
|
5 |
+
line-height: 1.428571429;
|
6 |
+
}
|
7 |
+
|
8 |
+
.circle-you {
|
9 |
+
width: 50px;
|
10 |
+
height: 50px;
|
11 |
+
background-color: rgb(238 78 59);
|
12 |
+
border-radius: 50%;
|
13 |
+
}
|
14 |
+
|
15 |
+
.circle-bot {
|
16 |
+
width: 50px;
|
17 |
+
height: 50px;
|
18 |
+
background-color: rgb(59 78 244);
|
19 |
+
border-radius: 50%;
|
20 |
+
float: left;
|
21 |
+
margin-right: 10px;
|
22 |
+
margin-top: 5px;
|
23 |
+
}
|
24 |
+
|
25 |
+
.circle-bot img,
|
26 |
+
.circle-you img {
|
27 |
+
border-radius: 50%;
|
28 |
+
width: 100%;
|
29 |
+
height: 100%;
|
30 |
+
object-fit: cover;
|
31 |
+
}
|
32 |
+
|
33 |
+
.circle-you {
|
34 |
+
margin-top: 5px;
|
35 |
+
float: right;
|
36 |
+
}
|
37 |
+
|
38 |
+
.circle-bot + .text, .circle-you + .text {
|
39 |
+
border-radius: 18px;
|
40 |
+
padding: 8px 12px;
|
41 |
+
}
|
42 |
+
|
43 |
+
.circle-bot + .text {
|
44 |
+
background-color: #E4E6EB;
|
45 |
+
float: left;
|
46 |
+
}
|
47 |
+
|
48 |
+
.circle-you + .text {
|
49 |
+
float: right;
|
50 |
+
background-color: rgb(0 132 255);
|
51 |
+
margin-right: 10px;
|
52 |
+
}
|
53 |
+
|
54 |
+
.circle-you + .text div, .circle-you + .text *, .dark .circle-you + .text div, .dark .circle-you + .text * {
|
55 |
+
color: #FFF !important;
|
56 |
+
}
|
57 |
+
|
58 |
+
.circle-you + .text .username {
|
59 |
+
text-align: right;
|
60 |
+
}
|
61 |
+
|
62 |
+
.dark .circle-bot + .text div, .dark .circle-bot + .text * {
|
63 |
+
color: #000;
|
64 |
+
}
|
65 |
+
|
66 |
+
.text {
|
67 |
+
max-width: 80%;
|
68 |
+
}
|
69 |
+
|
70 |
+
.text p {
|
71 |
+
margin-top: 5px;
|
72 |
+
}
|
73 |
+
|
74 |
+
.username {
|
75 |
+
font-weight: bold;
|
76 |
+
}
|
77 |
+
|
78 |
+
.message-body {
|
79 |
+
}
|
80 |
+
|
81 |
+
.message-body img {
|
82 |
+
max-width: 300px;
|
83 |
+
max-height: 300px;
|
84 |
+
border-radius: 20px;
|
85 |
+
}
|
86 |
+
|
87 |
+
.message-body p {
|
88 |
+
margin-bottom: 0 !important;
|
89 |
+
font-size: 15px !important;
|
90 |
+
line-height: 1.428571429 !important;
|
91 |
+
}
|
92 |
+
|
93 |
+
.dark .message-body p em {
|
94 |
+
color: rgb(138 138 138) !important;
|
95 |
+
}
|
96 |
+
|
97 |
+
.message-body p em {
|
98 |
+
color: rgb(110 110 110) !important;
|
99 |
+
}
|
css/chat_style-wpp.css
ADDED
@@ -0,0 +1,55 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.message {
|
2 |
+
padding-bottom: 25px;
|
3 |
+
font-size: 15px;
|
4 |
+
font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
|
5 |
+
line-height: 1.428571429;
|
6 |
+
}
|
7 |
+
|
8 |
+
.text-you {
|
9 |
+
background-color: #d9fdd3;
|
10 |
+
border-radius: 15px;
|
11 |
+
padding: 10px;
|
12 |
+
padding-top: 5px;
|
13 |
+
float: right;
|
14 |
+
}
|
15 |
+
|
16 |
+
.text-bot {
|
17 |
+
background-color: #f2f2f2;
|
18 |
+
border-radius: 15px;
|
19 |
+
padding: 10px;
|
20 |
+
padding-top: 5px;
|
21 |
+
}
|
22 |
+
|
23 |
+
.dark .text-you {
|
24 |
+
background-color: #005c4b;
|
25 |
+
color: #111b21;
|
26 |
+
}
|
27 |
+
|
28 |
+
.dark .text-bot {
|
29 |
+
background-color: #1f2937;
|
30 |
+
color: #111b21;
|
31 |
+
}
|
32 |
+
|
33 |
+
.text-bot p, .text-you p {
|
34 |
+
margin-top: 5px;
|
35 |
+
}
|
36 |
+
|
37 |
+
.message-body img {
|
38 |
+
max-width: 300px;
|
39 |
+
max-height: 300px;
|
40 |
+
border-radius: 20px;
|
41 |
+
}
|
42 |
+
|
43 |
+
.message-body p {
|
44 |
+
margin-bottom: 0 !important;
|
45 |
+
font-size: 15px !important;
|
46 |
+
line-height: 1.428571429 !important;
|
47 |
+
}
|
48 |
+
|
49 |
+
.dark .message-body p em {
|
50 |
+
color: rgb(138 138 138) !important;
|
51 |
+
}
|
52 |
+
|
53 |
+
.message-body p em {
|
54 |
+
color: rgb(110 110 110) !important;
|
55 |
+
}
|
css/html_4chan_style.css
ADDED
@@ -0,0 +1,73 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
#parent #container {
|
2 |
+
background-color: #eef2ff;
|
3 |
+
padding: 17px;
|
4 |
+
}
|
5 |
+
|
6 |
+
#parent #container .reply {
|
7 |
+
background-color: rgb(214 218 240);
|
8 |
+
border-bottom: 1px solid rgb(183 197 217);
|
9 |
+
border-image: none 100% 1 0 stretch;
|
10 |
+
border-left: 0 none rgb(0 0 0);
|
11 |
+
border-right: 1px solid rgb(183 197 217);
|
12 |
+
color: rgb(0 0 0);
|
13 |
+
display: table;
|
14 |
+
font-family: arial, helvetica, sans-serif;
|
15 |
+
font-size: 13.3333px;
|
16 |
+
margin: 4px 0;
|
17 |
+
overflow: hidden hidden;
|
18 |
+
padding: 4px 2px;
|
19 |
+
}
|
20 |
+
|
21 |
+
#parent #container .number {
|
22 |
+
color: rgb(0 0 0);
|
23 |
+
font-family: arial, helvetica, sans-serif;
|
24 |
+
font-size: 13.3333px;
|
25 |
+
width: 342.65px;
|
26 |
+
margin-right: 7px;
|
27 |
+
}
|
28 |
+
|
29 |
+
#parent #container .op {
|
30 |
+
color: rgb(0 0 0);
|
31 |
+
font-family: arial, helvetica, sans-serif;
|
32 |
+
font-size: 13.3333px;
|
33 |
+
margin: 4px 0 8px;
|
34 |
+
overflow: hidden hidden;
|
35 |
+
}
|
36 |
+
|
37 |
+
#parent #container .op blockquote {
|
38 |
+
margin-left: 0 !important;
|
39 |
+
}
|
40 |
+
|
41 |
+
#parent #container .name {
|
42 |
+
color: rgb(17 119 67);
|
43 |
+
font-family: arial, helvetica, sans-serif;
|
44 |
+
font-size: 13.3333px;
|
45 |
+
font-weight: 700;
|
46 |
+
margin-left: 7px;
|
47 |
+
}
|
48 |
+
|
49 |
+
#parent #container .quote {
|
50 |
+
color: rgb(221 0 0);
|
51 |
+
font-family: arial, helvetica, sans-serif;
|
52 |
+
font-size: 13.3333px;
|
53 |
+
text-decoration: underline solid rgb(221 0 0);
|
54 |
+
text-decoration-thickness: auto;
|
55 |
+
}
|
56 |
+
|
57 |
+
#parent #container .greentext {
|
58 |
+
color: rgb(120 153 34);
|
59 |
+
font-family: arial, helvetica, sans-serif;
|
60 |
+
font-size: 13.3333px;
|
61 |
+
}
|
62 |
+
|
63 |
+
#parent #container blockquote {
|
64 |
+
margin: 0 !important;
|
65 |
+
margin-block: 1em 1em;
|
66 |
+
margin-inline: 40px 40px;
|
67 |
+
margin: 13.33px 40px !important;
|
68 |
+
}
|
69 |
+
|
70 |
+
#parent #container .message_4chan {
|
71 |
+
color: black;
|
72 |
+
border: none;
|
73 |
+
}
|
css/html_instruct_style.css
ADDED
@@ -0,0 +1,75 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.chat {
|
2 |
+
background: var(--block-background-fill);
|
3 |
+
padding: 24px 19px;
|
4 |
+
padding-right: 19px !important;
|
5 |
+
border: 1px solid var(--block-border-color);
|
6 |
+
border-radius: 8px;
|
7 |
+
}
|
8 |
+
|
9 |
+
.message {
|
10 |
+
display: grid;
|
11 |
+
grid-template-columns: 60px 1fr;
|
12 |
+
padding-bottom: 25px;
|
13 |
+
font-size: 15px;
|
14 |
+
font-family: 'Noto Sans', Helvetica, Arial, sans-serif;
|
15 |
+
line-height: 24px;
|
16 |
+
}
|
17 |
+
|
18 |
+
.username {
|
19 |
+
display: none;
|
20 |
+
}
|
21 |
+
|
22 |
+
.message-body p, .message-body li {
|
23 |
+
font-size: 15px !important;
|
24 |
+
line-height: 24px !important;
|
25 |
+
}
|
26 |
+
|
27 |
+
.message-body p, .chat .message-body ul, .chat .message-body ol {
|
28 |
+
margin-bottom: 16px !important;
|
29 |
+
}
|
30 |
+
|
31 |
+
.message-body p:last-child, .chat .message-body ul:last-child, .chat .message-body ol:last-child {
|
32 |
+
margin-bottom: 0 !important;
|
33 |
+
}
|
34 |
+
|
35 |
+
.dark .message-body p em {
|
36 |
+
color: rgb(198 202 214) !important;
|
37 |
+
}
|
38 |
+
|
39 |
+
.message-body p em {
|
40 |
+
color: rgb(110 110 110) !important;
|
41 |
+
}
|
42 |
+
|
43 |
+
.gradio-container .chat .assistant-message {
|
44 |
+
padding: 20px;
|
45 |
+
background: var(--background-fill-secondary);
|
46 |
+
margin-top: 12px !important;
|
47 |
+
margin-bottom: 24px !important;
|
48 |
+
margin-right: 16px;
|
49 |
+
border-radius: 22px;
|
50 |
+
border-bottom-left-radius: 0;
|
51 |
+
border: 1px solid var(--border-color-primary);
|
52 |
+
}
|
53 |
+
|
54 |
+
.gradio-container .chat .user-message {
|
55 |
+
padding: 20px;
|
56 |
+
background-color: var(--color-accent-soft);
|
57 |
+
border-radius: 20px;
|
58 |
+
margin-bottom: 12px !important;
|
59 |
+
margin-left: 16px;
|
60 |
+
border-radius: 22px;
|
61 |
+
border-bottom-right-radius: 0;
|
62 |
+
border: 1px solid var(--border-color-accent-subdued);
|
63 |
+
}
|
64 |
+
|
65 |
+
.gradio-container .chat .assistant-message:last-child, .gradio-container .chat .user-message:last-child {
|
66 |
+
margin-bottom: 0 !important;
|
67 |
+
}
|
68 |
+
|
69 |
+
code {
|
70 |
+
background-color: #f3f4f6 !important;
|
71 |
+
}
|
72 |
+
|
73 |
+
.dark code {
|
74 |
+
background-color: #1f2937 !important;
|
75 |
+
}
|
css/html_readable_style.css
ADDED
@@ -0,0 +1,33 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.readable-container {
|
2 |
+
max-width: 600px;
|
3 |
+
margin-left: auto;
|
4 |
+
margin-right: auto;
|
5 |
+
background-color: rgb(31 41 55);
|
6 |
+
padding: 3em;
|
7 |
+
word-break: break-word;
|
8 |
+
overflow-wrap: anywhere;
|
9 |
+
color: #efefef !important;
|
10 |
+
}
|
11 |
+
|
12 |
+
.readable-container p, .readable-container li {
|
13 |
+
font-size: 16px !important;
|
14 |
+
color: #efefef !important;
|
15 |
+
margin-bottom: 22px;
|
16 |
+
line-height: 1.4 !important;
|
17 |
+
}
|
18 |
+
|
19 |
+
.readable-container li > p {
|
20 |
+
display: inline !important;
|
21 |
+
}
|
22 |
+
|
23 |
+
.readable-container code {
|
24 |
+
overflow-x: auto;
|
25 |
+
}
|
26 |
+
|
27 |
+
.readable-container :not(pre) > code {
|
28 |
+
white-space: normal !important;
|
29 |
+
}
|
30 |
+
|
31 |
+
.readable-container .hoverable {
|
32 |
+
font-size: 14px;
|
33 |
+
}
|
css/main.css
ADDED
@@ -0,0 +1,678 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.tabs.svelte-710i53 {
|
2 |
+
margin-top: 0
|
3 |
+
}
|
4 |
+
|
5 |
+
.py-6 {
|
6 |
+
padding-top: 2.5rem
|
7 |
+
}
|
8 |
+
|
9 |
+
.small-button {
|
10 |
+
min-width: 0 !important;
|
11 |
+
max-width: 171px;
|
12 |
+
height: 39.594px;
|
13 |
+
align-self: end;
|
14 |
+
}
|
15 |
+
|
16 |
+
.refresh-button {
|
17 |
+
max-width: 4.4em;
|
18 |
+
min-width: 2.2em !important;
|
19 |
+
height: 39.594px;
|
20 |
+
align-self: end;
|
21 |
+
line-height: 1em;
|
22 |
+
border-radius: 0.5em;
|
23 |
+
flex: none;
|
24 |
+
}
|
25 |
+
|
26 |
+
.refresh-button-small {
|
27 |
+
max-width: 2.2em;
|
28 |
+
}
|
29 |
+
|
30 |
+
.button_nowrap {
|
31 |
+
white-space: nowrap;
|
32 |
+
}
|
33 |
+
|
34 |
+
#slim-column {
|
35 |
+
flex: none !important;
|
36 |
+
min-width: 0 !important;
|
37 |
+
}
|
38 |
+
|
39 |
+
.slim-dropdown {
|
40 |
+
background-color: transparent !important;
|
41 |
+
border: none !important;
|
42 |
+
padding: 0 !important;
|
43 |
+
}
|
44 |
+
|
45 |
+
#download-label, #upload-label {
|
46 |
+
min-height: 0
|
47 |
+
}
|
48 |
+
|
49 |
+
.dark svg {
|
50 |
+
fill: white;
|
51 |
+
}
|
52 |
+
|
53 |
+
.dark a {
|
54 |
+
color: white !important;
|
55 |
+
}
|
56 |
+
|
57 |
+
ol li p, ul li p {
|
58 |
+
display: inline-block;
|
59 |
+
}
|
60 |
+
|
61 |
+
#chat-tab, #default-tab, #notebook-tab, #parameters, #chat-settings, #lora, #training-tab, #model-tab, #session-tab {
|
62 |
+
border: 0;
|
63 |
+
}
|
64 |
+
|
65 |
+
.gradio-container-3-18-0 .prose * h1, h2, h3, h4 {
|
66 |
+
color: white;
|
67 |
+
}
|
68 |
+
|
69 |
+
.gradio-container {
|
70 |
+
max-width: 100% !important;
|
71 |
+
padding-top: 0 !important;
|
72 |
+
}
|
73 |
+
|
74 |
+
#extensions {
|
75 |
+
margin-top: 5px;
|
76 |
+
margin-bottom: 35px;
|
77 |
+
}
|
78 |
+
|
79 |
+
.extension-tab {
|
80 |
+
border: 0 !important;
|
81 |
+
}
|
82 |
+
|
83 |
+
span.math.inline {
|
84 |
+
font-size: 27px;
|
85 |
+
vertical-align: baseline !important;
|
86 |
+
}
|
87 |
+
|
88 |
+
div.svelte-15lo0d8 > *, div.svelte-15lo0d8 > .form > * {
|
89 |
+
flex-wrap: nowrap;
|
90 |
+
}
|
91 |
+
|
92 |
+
.header_bar {
|
93 |
+
background-color: #f7f7f7;
|
94 |
+
margin-bottom: 19px;
|
95 |
+
overflow-x: scroll;
|
96 |
+
margin-left: calc(-1 * var(--size-4));
|
97 |
+
margin-right: calc(-1 * var(--size-4));
|
98 |
+
display: block !important;
|
99 |
+
text-wrap: nowrap;
|
100 |
+
}
|
101 |
+
|
102 |
+
.dark .header_bar {
|
103 |
+
border: none !important;
|
104 |
+
background-color: #8080802b;
|
105 |
+
}
|
106 |
+
|
107 |
+
.header_bar button.selected {
|
108 |
+
border-radius: 0;
|
109 |
+
}
|
110 |
+
|
111 |
+
.textbox_default textarea {
|
112 |
+
height: calc(100dvh - 271px);
|
113 |
+
}
|
114 |
+
|
115 |
+
.textbox_default_output textarea {
|
116 |
+
height: calc(100dvh - 185px);
|
117 |
+
}
|
118 |
+
|
119 |
+
.textbox textarea {
|
120 |
+
height: calc(100dvh - 241px);
|
121 |
+
}
|
122 |
+
|
123 |
+
.textbox_logits textarea {
|
124 |
+
height: calc(100dvh - 236px);
|
125 |
+
}
|
126 |
+
|
127 |
+
.textbox_logits_notebook textarea {
|
128 |
+
height: calc(100dvh - 292px);
|
129 |
+
}
|
130 |
+
|
131 |
+
.monospace textarea {
|
132 |
+
font-family: monospace;
|
133 |
+
}
|
134 |
+
|
135 |
+
.textbox_default textarea,
|
136 |
+
.textbox_default_output textarea,
|
137 |
+
.textbox_logits textarea,
|
138 |
+
.textbox_logits_notebook textarea,
|
139 |
+
.textbox textarea {
|
140 |
+
font-size: 16px !important;
|
141 |
+
color: #46464A !important;
|
142 |
+
}
|
143 |
+
|
144 |
+
.dark textarea {
|
145 |
+
color: #efefef !important;
|
146 |
+
}
|
147 |
+
|
148 |
+
@media screen and (width <= 711px) {
|
149 |
+
.textbox_default textarea {
|
150 |
+
height: calc(100dvh - 259px);
|
151 |
+
}
|
152 |
+
|
153 |
+
div .default-token-counter {
|
154 |
+
top: calc( 0.5 * (100dvh - 236px) ) !important;
|
155 |
+
}
|
156 |
+
|
157 |
+
.transparent-substring {
|
158 |
+
display: none;
|
159 |
+
}
|
160 |
+
|
161 |
+
.hover-menu {
|
162 |
+
min-width: 250px !important;
|
163 |
+
}
|
164 |
+
}
|
165 |
+
|
166 |
+
/* Hide the gradio footer */
|
167 |
+
footer {
|
168 |
+
display: none !important;
|
169 |
+
}
|
170 |
+
|
171 |
+
button {
|
172 |
+
font-size: 14px !important;
|
173 |
+
}
|
174 |
+
|
175 |
+
.file-saver {
|
176 |
+
position: fixed !important;
|
177 |
+
height: 100%;
|
178 |
+
z-index: 1000;
|
179 |
+
background-color: rgb(0 0 0 / 50%) !important;
|
180 |
+
margin-left: -20px;
|
181 |
+
margin-right: -20px;
|
182 |
+
}
|
183 |
+
|
184 |
+
.file-saver > :first-child {
|
185 |
+
position: fixed !important;
|
186 |
+
top: 50%;
|
187 |
+
left: 50%;
|
188 |
+
transform: translate(-50%, -50%); /* center horizontally */
|
189 |
+
width: 100%;
|
190 |
+
max-width: 500px;
|
191 |
+
background-color: var(--input-background-fill);
|
192 |
+
border: var(--input-border-width) solid var(--input-border-color) !important;
|
193 |
+
}
|
194 |
+
|
195 |
+
.file-saver > :first-child > :nth-child(2) {
|
196 |
+
background: var(--block-background-fill);
|
197 |
+
}
|
198 |
+
|
199 |
+
.checkboxgroup-table label {
|
200 |
+
background: none !important;
|
201 |
+
padding: 0 !important;
|
202 |
+
border: 0 !important;
|
203 |
+
}
|
204 |
+
|
205 |
+
.checkboxgroup-table div {
|
206 |
+
display: grid !important;
|
207 |
+
}
|
208 |
+
|
209 |
+
.markdown ul ol {
|
210 |
+
font-size: 100% !important;
|
211 |
+
}
|
212 |
+
|
213 |
+
.pretty_scrollbar::-webkit-scrollbar {
|
214 |
+
width: 5px;
|
215 |
+
}
|
216 |
+
|
217 |
+
.pretty_scrollbar::-webkit-scrollbar-track {
|
218 |
+
background: transparent;
|
219 |
+
}
|
220 |
+
|
221 |
+
.pretty_scrollbar::-webkit-scrollbar-thumb,
|
222 |
+
.pretty_scrollbar::-webkit-scrollbar-thumb:hover {
|
223 |
+
background: #c5c5d2;
|
224 |
+
}
|
225 |
+
|
226 |
+
.dark .pretty_scrollbar::-webkit-scrollbar-thumb,
|
227 |
+
.dark .pretty_scrollbar::-webkit-scrollbar-thumb:hover {
|
228 |
+
background: #374151;
|
229 |
+
}
|
230 |
+
|
231 |
+
.pretty_scrollbar::-webkit-resizer {
|
232 |
+
background: #c5c5d2;
|
233 |
+
}
|
234 |
+
|
235 |
+
.dark .pretty_scrollbar::-webkit-resizer {
|
236 |
+
background: #374151;
|
237 |
+
}
|
238 |
+
|
239 |
+
audio {
|
240 |
+
max-width: 100%;
|
241 |
+
}
|
242 |
+
|
243 |
+
/* Copied from https://github.com/AUTOMATIC1111/stable-diffusion-webui */
|
244 |
+
.token-counter {
|
245 |
+
position: absolute !important;
|
246 |
+
top: calc( 0.5 * (100dvh - 218px) ) !important;
|
247 |
+
right: 2px;
|
248 |
+
z-index: 100;
|
249 |
+
background: var(--input-background-fill) !important;
|
250 |
+
min-height: 0 !important;
|
251 |
+
}
|
252 |
+
|
253 |
+
.default-token-counter {
|
254 |
+
top: calc( 0.5 * (100dvh - 248px) ) !important;
|
255 |
+
}
|
256 |
+
|
257 |
+
.token-counter span {
|
258 |
+
padding: 1px;
|
259 |
+
box-shadow: 0 0 0 0.3em rgb(192 192 192 / 15%), inset 0 0 0.6em rgb(192 192 192 / 7.5%);
|
260 |
+
border: 2px solid rgb(192 192 192 / 40%) !important;
|
261 |
+
border-radius: 0.4em;
|
262 |
+
}
|
263 |
+
|
264 |
+
.no-background {
|
265 |
+
background: var(--background-fill-primary) !important;
|
266 |
+
padding: 0 !important;
|
267 |
+
}
|
268 |
+
|
269 |
+
/* ----------------------------------------------
|
270 |
+
Chat tab
|
271 |
+
---------------------------------------------- */
|
272 |
+
.h-\[40vh\], .wrap.svelte-byatnx.svelte-byatnx.svelte-byatnx {
|
273 |
+
height: 66.67vh
|
274 |
+
}
|
275 |
+
|
276 |
+
.gradio-container {
|
277 |
+
margin-left: auto !important;
|
278 |
+
margin-right: auto !important;
|
279 |
+
}
|
280 |
+
|
281 |
+
.w-screen {
|
282 |
+
width: unset
|
283 |
+
}
|
284 |
+
|
285 |
+
div.svelte-362y77>*, div.svelte-362y77>.form>* {
|
286 |
+
flex-wrap: nowrap
|
287 |
+
}
|
288 |
+
|
289 |
+
.pending.svelte-1ed2p3z {
|
290 |
+
opacity: 1;
|
291 |
+
}
|
292 |
+
|
293 |
+
.wrap.svelte-6roggh.svelte-6roggh {
|
294 |
+
max-height: 92.5%;
|
295 |
+
}
|
296 |
+
|
297 |
+
/* This is for the microphone button in the whisper extension */
|
298 |
+
.sm.svelte-1ipelgc {
|
299 |
+
width: 100%;
|
300 |
+
}
|
301 |
+
|
302 |
+
#chat-tab button#Generate, #chat-tab button#stop {
|
303 |
+
width: 89.3438px !important;
|
304 |
+
}
|
305 |
+
|
306 |
+
#chat-tab button, #notebook-tab button, #default-tab button {
|
307 |
+
min-width: 0 !important;
|
308 |
+
}
|
309 |
+
|
310 |
+
#chat-tab > :first-child, #extensions {
|
311 |
+
max-width: 880px;
|
312 |
+
margin-left: auto;
|
313 |
+
margin-right: auto;
|
314 |
+
}
|
315 |
+
|
316 |
+
@media screen and (width <= 688px) {
|
317 |
+
#chat-tab {
|
318 |
+
padding-left: 0;
|
319 |
+
padding-right: 0;
|
320 |
+
}
|
321 |
+
|
322 |
+
.chat-parent {
|
323 |
+
height: calc(100dvh - 179px) !important;
|
324 |
+
}
|
325 |
+
|
326 |
+
.old-ui .chat-parent {
|
327 |
+
height: calc(100dvh - 310px) !important;
|
328 |
+
}
|
329 |
+
}
|
330 |
+
|
331 |
+
.chat {
|
332 |
+
margin-left: auto;
|
333 |
+
margin-right: auto;
|
334 |
+
max-width: 880px;
|
335 |
+
min-height: var(--chat-height);
|
336 |
+
overflow-y: auto;
|
337 |
+
padding-right: 15px;
|
338 |
+
display: flex;
|
339 |
+
flex-direction: column;
|
340 |
+
word-break: break-word;
|
341 |
+
overflow-wrap: anywhere;
|
342 |
+
}
|
343 |
+
|
344 |
+
.chat-parent {
|
345 |
+
height: calc(100dvh - 181px);
|
346 |
+
overflow: auto !important;
|
347 |
+
}
|
348 |
+
|
349 |
+
.old-ui .chat-parent {
|
350 |
+
height: calc(100dvh - 270px);
|
351 |
+
}
|
352 |
+
|
353 |
+
.chat-parent.bigchat {
|
354 |
+
height: calc(100dvh - 181px) !important;
|
355 |
+
}
|
356 |
+
|
357 |
+
.chat > .messages {
|
358 |
+
display: flex;
|
359 |
+
flex-direction: column;
|
360 |
+
}
|
361 |
+
|
362 |
+
.chat .message:last-child {
|
363 |
+
margin-bottom: 0 !important;
|
364 |
+
padding-bottom: 0 !important;
|
365 |
+
}
|
366 |
+
|
367 |
+
.message-body li {
|
368 |
+
list-style-position: outside;
|
369 |
+
}
|
370 |
+
|
371 |
+
.chat .message-body ul, .chat .message-body ol {
|
372 |
+
padding-inline-start: 2em;
|
373 |
+
}
|
374 |
+
|
375 |
+
.message-body li:not(:last-child) {
|
376 |
+
margin-top: 0 !important;
|
377 |
+
margin-bottom: 2px !important;
|
378 |
+
}
|
379 |
+
|
380 |
+
.message-body li:last-child {
|
381 |
+
margin-bottom: 0 !important;
|
382 |
+
}
|
383 |
+
|
384 |
+
.message-body li > p {
|
385 |
+
display: inline !important;
|
386 |
+
}
|
387 |
+
|
388 |
+
.message-body ul, .message-body ol {
|
389 |
+
font-size: 15px !important;
|
390 |
+
}
|
391 |
+
|
392 |
+
.message-body ul {
|
393 |
+
list-style-type: disc !important;
|
394 |
+
}
|
395 |
+
|
396 |
+
.message-body pre:not(:last-child) {
|
397 |
+
margin-bottom: 35.625px !important;
|
398 |
+
}
|
399 |
+
|
400 |
+
.message-body pre:last-child {
|
401 |
+
margin-bottom: 0 !important;
|
402 |
+
}
|
403 |
+
|
404 |
+
.message-body code {
|
405 |
+
white-space: pre-wrap !important;
|
406 |
+
word-wrap: break-word !important;
|
407 |
+
border: 1px solid var(--border-color-primary);
|
408 |
+
border-radius: var(--radius-sm);
|
409 |
+
background: var(--background-fill-secondary);
|
410 |
+
font-size: 90%;
|
411 |
+
padding: 1px 3px;
|
412 |
+
}
|
413 |
+
|
414 |
+
.message-body pre > code {
|
415 |
+
display: block;
|
416 |
+
padding: 15px;
|
417 |
+
}
|
418 |
+
|
419 |
+
.message-body :not(pre) > code {
|
420 |
+
white-space: normal !important;
|
421 |
+
}
|
422 |
+
|
423 |
+
#chat-input {
|
424 |
+
padding: 0;
|
425 |
+
padding-top: 18px;
|
426 |
+
background: transparent;
|
427 |
+
border: none;
|
428 |
+
}
|
429 |
+
|
430 |
+
#chat-input textarea:focus {
|
431 |
+
box-shadow: none !important;
|
432 |
+
}
|
433 |
+
|
434 |
+
#chat-input > :first-child {
|
435 |
+
background-color: transparent;
|
436 |
+
}
|
437 |
+
|
438 |
+
#chat-input .progress-text {
|
439 |
+
display: none;
|
440 |
+
}
|
441 |
+
|
442 |
+
@media print {
|
443 |
+
body {
|
444 |
+
visibility: hidden;
|
445 |
+
}
|
446 |
+
|
447 |
+
.chat {
|
448 |
+
visibility: visible;
|
449 |
+
position: absolute;
|
450 |
+
left: 0;
|
451 |
+
top: 0;
|
452 |
+
max-width: unset;
|
453 |
+
max-height: unset;
|
454 |
+
width: 100%;
|
455 |
+
overflow-y: visible;
|
456 |
+
}
|
457 |
+
|
458 |
+
.message {
|
459 |
+
break-inside: avoid;
|
460 |
+
}
|
461 |
+
|
462 |
+
.gradio-container {
|
463 |
+
overflow: visible;
|
464 |
+
}
|
465 |
+
|
466 |
+
.tab-nav {
|
467 |
+
display: none !important;
|
468 |
+
}
|
469 |
+
|
470 |
+
#chat-tab > :first-child {
|
471 |
+
max-width: unset;
|
472 |
+
}
|
473 |
+
}
|
474 |
+
|
475 |
+
#show-controls {
|
476 |
+
position: absolute;
|
477 |
+
height: 100%;
|
478 |
+
background-color: var(--background-fill-primary);
|
479 |
+
border: 0 !important;
|
480 |
+
border-radius: 0;
|
481 |
+
}
|
482 |
+
|
483 |
+
#show-controls label {
|
484 |
+
z-index: 1000;
|
485 |
+
position: absolute;
|
486 |
+
left: calc(100% - 168px);
|
487 |
+
}
|
488 |
+
|
489 |
+
#typing-container {
|
490 |
+
display: none;
|
491 |
+
position: absolute;
|
492 |
+
background-color: transparent;
|
493 |
+
left: -2px;
|
494 |
+
padding: var(--block-padding);
|
495 |
+
}
|
496 |
+
|
497 |
+
.typing {
|
498 |
+
position: relative;
|
499 |
+
}
|
500 |
+
|
501 |
+
.visible-dots #typing-container {
|
502 |
+
display: block;
|
503 |
+
}
|
504 |
+
|
505 |
+
.typing span {
|
506 |
+
content: '';
|
507 |
+
animation: blink 1.5s infinite;
|
508 |
+
animation-fill-mode: both;
|
509 |
+
height: 10px;
|
510 |
+
width: 10px;
|
511 |
+
background: #3b5998;;
|
512 |
+
position: absolute;
|
513 |
+
left:0;
|
514 |
+
top:0;
|
515 |
+
border-radius: 50%;
|
516 |
+
}
|
517 |
+
|
518 |
+
.typing .dot1 {
|
519 |
+
animation-delay: .2s;
|
520 |
+
margin-left: calc(10px * 1.5);
|
521 |
+
}
|
522 |
+
|
523 |
+
.typing .dot2 {
|
524 |
+
animation-delay: .4s;
|
525 |
+
margin-left: calc(10px * 3);
|
526 |
+
}
|
527 |
+
|
528 |
+
@keyframes blink {
|
529 |
+
0% {
|
530 |
+
opacity: .1;
|
531 |
+
}
|
532 |
+
|
533 |
+
20% {
|
534 |
+
opacity: 1;
|
535 |
+
}
|
536 |
+
|
537 |
+
100% {
|
538 |
+
opacity: .1;
|
539 |
+
}
|
540 |
+
}
|
541 |
+
|
542 |
+
#chat-tab .generating {
|
543 |
+
display: none !important;
|
544 |
+
}
|
545 |
+
|
546 |
+
.hover-element {
|
547 |
+
position: relative;
|
548 |
+
font-size: 24px;
|
549 |
+
}
|
550 |
+
|
551 |
+
.hover-menu {
|
552 |
+
display: none;
|
553 |
+
position: absolute;
|
554 |
+
bottom: 80%;
|
555 |
+
left: 0;
|
556 |
+
background-color: var(--background-fill-secondary);
|
557 |
+
box-shadow: 0 0 10px rgb(0 0 0 / 50%);
|
558 |
+
z-index: 10000;
|
559 |
+
min-width: 330px;
|
560 |
+
flex-direction: column;
|
561 |
+
}
|
562 |
+
|
563 |
+
.hover-menu button {
|
564 |
+
width: 100%;
|
565 |
+
background: transparent !important;
|
566 |
+
border-radius: 0 !important;
|
567 |
+
justify-content: space-between;
|
568 |
+
margin: 0 !important;
|
569 |
+
height: 36px;
|
570 |
+
}
|
571 |
+
|
572 |
+
.hover-menu button:not(#clear-history-confirm) {
|
573 |
+
border-bottom: 0 !important;
|
574 |
+
}
|
575 |
+
|
576 |
+
.hover-menu button:not(#clear-history-confirm):last-child {
|
577 |
+
border-bottom: var(--button-border-width) solid var(--button-secondary-border-color) !important;
|
578 |
+
}
|
579 |
+
|
580 |
+
.hover-menu button:hover {
|
581 |
+
background: var(--button-secondary-background-fill-hover) !important;
|
582 |
+
}
|
583 |
+
|
584 |
+
.transparent-substring {
|
585 |
+
opacity: 0.333;
|
586 |
+
}
|
587 |
+
|
588 |
+
#chat-tab:not(.old-ui) #chat-buttons {
|
589 |
+
display: none !important;
|
590 |
+
}
|
591 |
+
|
592 |
+
#gr-hover-container {
|
593 |
+
min-width: 0 !important;
|
594 |
+
display: flex;
|
595 |
+
flex-direction: column-reverse;
|
596 |
+
padding-right: 20px;
|
597 |
+
padding-bottom: 3px;
|
598 |
+
flex-grow: 0 !important;
|
599 |
+
}
|
600 |
+
|
601 |
+
#generate-stop-container {
|
602 |
+
min-width: 0 !important;
|
603 |
+
display: flex;
|
604 |
+
flex-direction: column-reverse;
|
605 |
+
padding-bottom: 3px;
|
606 |
+
flex: 0 auto !important;
|
607 |
+
}
|
608 |
+
|
609 |
+
#chat-input-container {
|
610 |
+
min-width: 0 !important;
|
611 |
+
}
|
612 |
+
|
613 |
+
#chat-input-container > .form {
|
614 |
+
background: transparent;
|
615 |
+
border: none;
|
616 |
+
}
|
617 |
+
|
618 |
+
#chat-input-row {
|
619 |
+
padding-bottom: 20px;
|
620 |
+
}
|
621 |
+
|
622 |
+
.old-ui #chat-input-row, #chat-input-row.bigchat {
|
623 |
+
padding-bottom: 0 !important;
|
624 |
+
}
|
625 |
+
|
626 |
+
#chat-col {
|
627 |
+
padding-bottom: 115px;
|
628 |
+
}
|
629 |
+
|
630 |
+
.old-ui #chat-col, #chat-col.bigchat {
|
631 |
+
padding-bottom: 95px !important;
|
632 |
+
}
|
633 |
+
|
634 |
+
.old-ui #chat-buttons #clear-history-confirm {
|
635 |
+
order: -1;
|
636 |
+
}
|
637 |
+
|
638 |
+
.chat ol, .chat ul {
|
639 |
+
margin-top: 6px !important;
|
640 |
+
}
|
641 |
+
|
642 |
+
/* ----------------------------------------------
|
643 |
+
Past chats menus
|
644 |
+
---------------------------------------------- */
|
645 |
+
#past-chats-row {
|
646 |
+
margin-bottom: calc( -1 * var(--layout-gap) );
|
647 |
+
}
|
648 |
+
|
649 |
+
#rename-row label {
|
650 |
+
margin-top: var(--layout-gap);
|
651 |
+
}
|
652 |
+
|
653 |
+
/* ----------------------------------------------
|
654 |
+
Keep dropdown menus above errored components
|
655 |
+
---------------------------------------------- */
|
656 |
+
.options {
|
657 |
+
z-index: 100 !important;
|
658 |
+
}
|
659 |
+
|
660 |
+
/* ----------------------------------------------
|
661 |
+
Big profile picture for characters
|
662 |
+
---------------------------------------------- */
|
663 |
+
.bigProfilePicture {
|
664 |
+
position: fixed;
|
665 |
+
bottom: 0;
|
666 |
+
left: 0;
|
667 |
+
width: calc((100vw - 880px - 120px) /2);
|
668 |
+
}
|
669 |
+
|
670 |
+
.pfp_character:hover {
|
671 |
+
cursor: pointer;
|
672 |
+
}
|
673 |
+
|
674 |
+
@media screen and (width <= 1300px) {
|
675 |
+
.bigProfilePicture {
|
676 |
+
display: none;
|
677 |
+
}
|
678 |
+
}
|