Massive style changes
This commit is contained in:
Meleki committed
1 parent
bd34d119b5
commit
b07e776b7a
16 files changed
+235
-217
No files matched your search
+74
-71
@@ -1,9 +1,24 @@
|
||||
.chat-page .page-content {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
#chat {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 2em 1em 3em;
|
||||
gap: calc(var(--box-spacing) / 2);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: var(--chat-bg);
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
/* Custom Command Buttons */
|
||||
|
||||
.custom-cmd-bar {
|
||||
display: flex;
|
||||
gap: var(--s2);
|
||||
margin-left: var(--s3);
|
||||
gap: var(--badge-spacing);
|
||||
margin-left: var(--badge-spacing);
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
@@ -32,9 +47,10 @@
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
right: 0;
|
||||
margin-top: var(--s1);
|
||||
margin-top: .5em;
|
||||
background: var(--f3-bg);
|
||||
border: var(--border-width) solid var(--f3-border);
|
||||
border-radius: var(--border-radius);
|
||||
min-width: 10em;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
@@ -48,7 +64,7 @@
|
||||
.header-menu-item {
|
||||
border: none;
|
||||
text-align: left;
|
||||
padding: var(--s2) var(--s3);
|
||||
padding: var(--menu-item-padding);
|
||||
background: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
@@ -58,30 +74,25 @@
|
||||
border: none;
|
||||
}
|
||||
|
||||
.chat-page .page-content > * {
|
||||
width: 1000px;
|
||||
}
|
||||
|
||||
#chat {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: var(--s4);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--s4);
|
||||
}
|
||||
|
||||
.meta-bar {
|
||||
padding: var(--s2);
|
||||
margin: var(--badge-spacing);
|
||||
padding: var(--box-padding);
|
||||
background: var(--f1-bg);
|
||||
border-bottom: var(--border-width) solid var(--f1-border);
|
||||
border-radius: var(--border-radius);
|
||||
flex-shrink: 0;
|
||||
min-height: 2.5em;
|
||||
opacity: var(--semi-transparent);
|
||||
height: 3em;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.msg, .tool-box {
|
||||
border-radius: var(--border-radius);
|
||||
padding: var(--box-padding);
|
||||
max-width: 80%;
|
||||
}
|
||||
|
||||
.msg {
|
||||
padding: var(--s3) var(--s4);
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
@@ -100,9 +111,8 @@
|
||||
|
||||
.msg.system-info {
|
||||
align-self: center;
|
||||
border: var(--border-width) solid var(--f2-border);
|
||||
text-align: center;
|
||||
padding: var(--s2);
|
||||
border: var(--border-width) solid var(--f2-border);
|
||||
}
|
||||
|
||||
.msg .cursor {
|
||||
@@ -124,7 +134,10 @@
|
||||
align-self: flex-start;
|
||||
background: var(--f1-bg);
|
||||
border: var(--border-width) solid var(--f1-border);
|
||||
padding: var(--s3);
|
||||
}
|
||||
|
||||
.tool-box > * {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.tool-box:has(.tool-box-header) {
|
||||
@@ -138,21 +151,20 @@
|
||||
.tool-box-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--s2);
|
||||
padding: var(--s3);
|
||||
gap: var(--box-spacing);
|
||||
padding: var(--box-padding);
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.tool-error-badge {
|
||||
color: #ff6b6b;
|
||||
border: var(--border-width) solid #ff6b6b;
|
||||
padding: 0 var(--s1);
|
||||
color: var(--dangerous);
|
||||
border: var(--border-width) solid var(--dangerous);
|
||||
padding: var(--box-padding);
|
||||
}
|
||||
|
||||
/* Diff View */
|
||||
|
||||
.tool-diff {
|
||||
font-family: monospace;
|
||||
max-height: 16.5em;
|
||||
overflow: auto;
|
||||
}
|
||||
@@ -179,28 +191,21 @@
|
||||
text-align: center;
|
||||
user-select: none;
|
||||
border-right: var(--border-width) solid var(--f2-border);
|
||||
margin-right: var(--s2);
|
||||
margin-right: .5em;
|
||||
}
|
||||
|
||||
.diff-content {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
padding-right: var(--s2);
|
||||
}
|
||||
|
||||
.diff-more {
|
||||
padding: var(--s1) var(--s2);
|
||||
opacity: var(--semi-transparent);
|
||||
font-family: monospace;
|
||||
padding-right: .5em;
|
||||
}
|
||||
|
||||
.tool-result {
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
font-family: monospace;
|
||||
padding: var(--s4);
|
||||
max-height: 16em;
|
||||
padding: var(--box-padding);
|
||||
max-height: 16.5em;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@@ -210,11 +215,20 @@
|
||||
}
|
||||
|
||||
.input-area {
|
||||
border-top: var(--border-width) solid var(--f1-border);
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
gap: var(--s4);
|
||||
padding: var(--s4);
|
||||
align-items: center;
|
||||
margin-bottom: var(--page-spacing);
|
||||
margin-inline: var(--badge-spacing);
|
||||
gap: var(--badge-spacing);
|
||||
}
|
||||
|
||||
.input-area button {
|
||||
width: 2em;
|
||||
aspect-ratio: 1;
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.input-area textarea {
|
||||
@@ -224,18 +238,10 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.input-area button {
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
.input-area button:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.archive-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--s4);
|
||||
gap: var(--box-spacing);
|
||||
}
|
||||
|
||||
.archived {
|
||||
@@ -250,11 +256,11 @@
|
||||
/* Workspace Refs */
|
||||
|
||||
.ref-preview {
|
||||
padding: var(--s2) var(--s4);
|
||||
background: var(--f1-bg);
|
||||
border-top: var(--border-width) solid var(--f1-border);
|
||||
flex-wrap: wrap;
|
||||
gap: var(--s2);
|
||||
padding: var(--box-padding);
|
||||
gap: var(--badge-spacing);
|
||||
}
|
||||
|
||||
.ref-preview:not([hidden]) {
|
||||
@@ -264,8 +270,8 @@
|
||||
.ref-preview-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--s2);
|
||||
padding: var(--s1) var(--s2);
|
||||
padding: var(--badge-padding);
|
||||
gap: var(--badge-spacing);
|
||||
background: var(--f2-bg);
|
||||
border: var(--border-width) solid var(--f2-border);
|
||||
}
|
||||
@@ -282,20 +288,22 @@
|
||||
|
||||
/* File Upload */
|
||||
|
||||
.file-btn {
|
||||
align-self: flex-end;
|
||||
}
|
||||
|
||||
.file-preview {
|
||||
padding: var(--s2) var(--s4);
|
||||
flex-direction: column;
|
||||
gap: var(--box-spacing);
|
||||
padding: var(--box-padding);
|
||||
background: var(--f1-bg);
|
||||
border-top: var(--border-width) solid var(--f1-border);
|
||||
}
|
||||
|
||||
.file-preview:not([hidden]) {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.file-preview-inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--s3);
|
||||
gap: var(--box-spacing);
|
||||
}
|
||||
|
||||
.file-thumb {
|
||||
@@ -305,10 +313,6 @@
|
||||
border: var(--border-width) solid var(--f2-border);
|
||||
}
|
||||
|
||||
.file-icon {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.file-name {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
@@ -320,7 +324,6 @@
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
padding: var(--s1);
|
||||
color: var(--text);
|
||||
opacity: var(--semi-transparent);
|
||||
}
|
||||
@@ -332,7 +335,7 @@
|
||||
/* Attachments in History */
|
||||
|
||||
.attachment-indicator {
|
||||
margin-top: var(--s2);
|
||||
margin-top: var(--badge-spacing);
|
||||
opacity: var(--semi-transparent);
|
||||
}
|
||||
|
||||
@@ -341,10 +344,10 @@
|
||||
}
|
||||
|
||||
.attachment-container {
|
||||
margin-top: var(--s2);
|
||||
margin-top: var(--badge-spacing);
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var(--s2);
|
||||
gap: var(--badge-spacing);
|
||||
}
|
||||
|
||||
.attachment-image {
|
||||
@@ -357,7 +360,7 @@
|
||||
|
||||
.attachment-file {
|
||||
display: inline-block;
|
||||
padding: var(--s2) var(--s3);
|
||||
padding: var(--badge-padding);
|
||||
background: var(--f2-bg);
|
||||
border: var(--border-width) solid var(--f2-border);
|
||||
text-decoration: none;
|
||||
|
||||
Reference in new issue
Block a user