File size: 2,157 Bytes
6e6dab9
 
 
 
 
 
c00fa7c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
6e6dab9
 
 
 
 
c00fa7c
6e6dab9
 
 
 
 
2e70541
02acd51
ebbfc38
02acd51
 
6e6dab9
 
 
 
 
 
 
 
 
b9716d2
6e6dab9
 
 
a53437c
6e6dab9
 
 
 
7dd081a
9136fd8
 
 
f2868f6
6e6dab9
ac03bb3
 
 
c98264e
 
 
 
 
 
a2d6a63
 
 
 
 
 
 
 
 
 
 
 
 
c98264e
d1f0f2d
 
 
 
4006506
 
 
 
 
 
 
 
 
c98264e
 
0613e49
c98264e
 
0613e49
c98264e
 
0613e49
c98264e
 
 
 
 
 
c5c7ecf
0613e49
 
 
 
c5c7ecf
 
 
 
65e47ec
 
 
 
 
 
c5c7ecf
 
c00fa7c
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
.grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-gap: 10px;
}

.container {
    max-width: 100vw;
}

#chat-history-sidebar {
    background-color: rgba(255, 255, 255, 0.5);
}

/* Adaptation for mobile */
@media (min-width: 900px) {
    .container {
        max-width: 900px;
    }
}

.available-model-item {
    display: flex;
    align-items: center;
    justify-content: center;
}

.available-model-item:hover {
    background-color: #dbedff;
    cursor: pointer;
}

#chat-session-container {
    overflow-y: auto;
    overflow-x: hidden;
}

#user-input {
    resize: none;
    max-height: 500px;
}

.chat-user {
    color: black;
    border: lightgray 1px solid;
    background-color: #eafaf1;
    white-space: pre-wrap;
}

.chat-assistant {
    /* color: blue; */
    border: lightgray 1px solid;
}

#available-models-select {
    max-width: calc(100vw - 200px);
}

#temperature-select {
    max-width: 75px;
}

.fa-spin-fast {
    animation: fa-spin 0.6s infinite linear;
    color: orange;
}

.fa-fade-fast {
    animation: fa-fade 1.5s infinite linear;
    color: orange;
}

.message-viewer .edit-button,
.message-viewer .copy-button,
.message-viewer .regenerate-button {
    display: none;
}

.message-viewer:hover .edit-button,
.message-viewer:hover .copy-button,
.message-viewer:hover .regenerate-button {
    display: inline-block;
}

.message-viewer * {
    margin-bottom: 0;
}

/* https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/ */
.message-viewer .role-displayer,
.message-viewer .content-displayer {
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
}

@keyframes blink {
    0% {
        background-color: transparent;
    }
    50% {
        background-color: antiquewhite;
    }
    100% {
        background-color: transparent;
    }
}

.blinking {
    animation: blink 2s infinite;
}

.inferring {
    background-color: rgba(255, 147, 40, 0.25);
}

.fa:hover {
    color: lightsalmon;
}

.fa-small {
    font-size: small;
    margin: 0;
    padding: 0;
}

.icon-success {
    color: green;
}