Hugging Face's logo

Spaces:
Pq234
/
chat-template-playground
Sleeping

App Files Community
1
chat-template-playground
File size: 4,271 Bytes
50bebf4
6426ece
 
 
8479d68
 
 
 
 
 
 
 
 
6426ece
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8479d68
6426ece
 
 
 
 
 
 
 
 
 
8479d68
6426ece
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
@import 'tailwindcss';

@custom-variant dark (&:where(.dark, .dark *));

/* Thin subtle scrollbars */
* {
	scrollbar-width: thin;
	scrollbar-color: rgba(0, 0, 0, 0.15) transparent;
}
.dark * {
	scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
}

.codemirror-wrapper {
	@apply overflow-auto text-sm;
}
.codemirror-wrapper .cm-editor {
	@apply bg-transparent;
}
.codemirror-wrapper .cm-content {
	@apply min-h-[12rem] font-mono;
}
.codemirror-wrapper .cm-gutter {
	@apply min-h-[12rem];
}
.codemirror-wrapper .cm-gutters {
	@apply border-gray-200 bg-gray-50 text-gray-400 dark:border-gray-900 dark:bg-gray-900;
}
.codemirror-wrapper .cm-line {
	@apply pl-2 selection:bg-blue-200! dark:bg-gray-900 dark:selection:bg-gray-700!;
}
.codemirror-wrapper .cm-activeLine {
	@apply bg-blue-50 dark:bg-gray-900;
}
.codemirror-wrapper .cm-activeLineGutter {
	@apply bg-blue-100 dark:bg-gray-900;
}
.codemirror-wrapper .cm-scroller,
.codemirror-wrapper .cm-editor.cm-focused {
	@apply outline-none;
}

/* Hide codemirror default search component since we have CodeMirrorSearch.svelte */
.codemirror-wrapper .cm-search {
	@apply hidden;
}

@utility btn-base {
	@apply inline-flex cursor-pointer items-center justify-center rounded-lg border px-3 py-1 whitespace-nowrap select-none focus:ring-3 focus:outline-hidden;
}

@utility btn {
	@apply btn-base;
	@apply border-gray-200 bg-gray-100 text-gray-800 hover:bg-gray-200 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700;
	&:disabled {
		@apply cursor-not-allowed opacity-50;
	}
	&.btn-lg {
		@apply px-4 py-1.5 font-normal;
	}
}

@utility btn-widget {
	@apply btn-base;
	@apply h-8 bg-gray-100 hover:bg-gray-200 dark:border-gray-700 dark:bg-gray-800 dark:hover:bg-gray-700;
	&:disabled {
		@apply cursor-not-allowed opacity-50;
	}
}

@utility btn-warning {
	@apply btn-base;
	@apply border-orange-200 bg-linear-to-b from-white to-orange-100 text-orange-700 hover:shadow-inner dark:border-orange-800 dark:from-orange-800 dark:to-orange-900 dark:text-orange-200 dark:hover:from-orange-700 dark:hover:to-orange-900;
}

@utility btn-green {
	@apply btn-base;
	@apply border-green-500 bg-green-500 text-white hover:shadow-inner dark:border-gray-800 dark:from-gray-800 dark:to-gray-950 dark:text-gray-200 dark:hover:from-gray-700 dark:hover:to-gray-950;
}

@utility btn-pink {
	@apply btn-base;
	@apply border-red-400 bg-red-400 text-white hover:shadow-inner dark:border-gray-800 dark:from-gray-800 dark:to-gray-950 dark:text-gray-200 dark:hover:from-gray-700 dark:hover:to-gray-950;
}

@utility btn-sky {
	@apply btn-base;
	@apply border-sky-600 bg-sky-600 text-white hover:shadow-inner dark:border-gray-800 dark:from-gray-800 dark:to-gray-950 dark:text-gray-200 dark:hover:from-gray-700 dark:hover:to-gray-950;
}

@utility btn-sky-ligher {
	@apply btn-base;
	@apply border-sky-500 bg-sky-500 text-white hover:shadow-inner dark:border-gray-800 dark:from-gray-800 dark:to-gray-950 dark:text-gray-200 dark:hover:from-gray-700 dark:hover:to-gray-950;
}

@utility btn-fuchsia {
	@apply btn-base;
	@apply border-fuchsia-600 bg-fuchsia-600 text-white hover:shadow-inner dark:border-gray-800 dark:from-gray-800 dark:to-gray-950 dark:text-gray-200 dark:hover:from-gray-700;
}

@utility btn-disabled {
	@apply cursor-not-allowed opacity-50;
}

@utility btn-widget-disabled {
	@apply cursor-not-allowed opacity-50;
}

@utility btn-lg {
	&.btn {
		@apply px-4 py-1.5 font-normal;
	}
}

@utility btn-green-lg {
	@apply px-10 py-2;
}

@utility btn-fuchsia-lg {
	@apply px-10 py-2;
}

@utility tooltip-mask {
	@apply pointer-events-none absolute overflow-visible bg-transparent;
}
@utility tooltip {
	@apply pointer-events-auto absolute z-50 w-max max-w-44 transform rounded-lg border-black bg-black p-2 text-xs leading-tight font-normal break-words text-white shadow transition-opacity dark:bg-gray-800;
}
@utility tooltip-arrow {
	@apply absolute z-0 size-2 rotate-45 transform bg-black dark:bg-gray-800;
}

.alert {
	@apply rounded-md border border-blue-100 bg-blue-50 px-3 py-2 text-blue-900 dark:border-blue-800/30 dark:bg-blue-800/30 dark:text-blue-200;
}
.alert a {
	@apply underline;
}
.alert-error {
	@apply border-red-100 bg-red-50 text-red-900 dark:border-red-800/30 dark:bg-red-800/30 dark:text-red-200;
}