File size: 1,909 Bytes
6e6dab9
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
2e70541
02acd51
ebbfc38
02acd51
 
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
 
 
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
.grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-gap: 10px;
}

.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;
}

.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;
}