fighting the insanity that is css

This commit is contained in:
Kyle Drake 2024-03-27 18:56:40 -05:00
parent e732c3ad8b
commit efd61fb885
2 changed files with 119 additions and 127 deletions

View file

@ -2147,15 +2147,6 @@ a.tag:hover {
.row.editor { .row.editor {
display: flex; display: flex;
flex-direction: row;
height: 100%;
overflow-y: auto;
width: 100%;
margin: 0;
.col {
height: 100%;
padding: 0;
}
} }
.header-Outro.with-columns.press .col { .header-Outro.with-columns.press .col {
@ -2279,39 +2270,44 @@ pre, code {
.left-col {
padding: 1rem;
.chat-container { overflow-y: scroll;
display: flex; height: 90vh;
flex-direction: column;
height: calc(100vh - 60px); /* Adjust the height as needed */
color: #e0e0e0;
border-left: 1px solid #373737;
font-family: Arial, sans-serif;
} }
.right-col {
padding: 1rem;
position: relative;
}
.chat-container {
border-left: 1px solid #373737;
font-family: Arial, sans-serif;
font-weight: 300;
font-size: 13.5px;
line-height: 1.5em;
.chat-box { .chat-box {
flex: 1; overflow-y: scroll;
overflow-y: auto; height: calc(90vh - 60px);
padding: 10px; padding: 10px;
background-color: #1d1f21; background-color: #1d1f21;
font-weight: 300; font-weight: 300;
font-size: 13.5px; font-size: 13.5px;
line-height: 1.5em; line-height: 1.5em;
}
.chat-box p { p {
font-weight: 300; font-weight: 300;
font-size: 13.5px; font-size: 13.5px;
word-break: break-word; word-break: break-word;
} }
.chat-box ul, ul, ol {
.chat-box ol {
list-style: square; list-style: square;
} }
.chat-box li { li {
font-weight: 300; font-weight: 300;
font-size: 13.5px; font-size: 13.5px;
} }
@ -2333,27 +2329,27 @@ pre, code {
background-color: #5e95a1; background-color: #5e95a1;
} }
.chat-box div code { div code {
display: inline; display: inline;
padding: 2px; padding: 2px;
} }
.chat-box div pre { div pre {
display: block; display: block;
width: 100%; width: 100%;
} }
.chat-box div pre code { div code {
display: block;
}
.chat-box div code {
border-left: 0px; border-left: 0px;
border: 0px; border: 0px;
word-wrap: break-word; word-wrap: break-word;
white-space: pre-wrap; white-space: pre-wrap;
} }
div pre code {
display: block;
}
.copy-button { .copy-button {
position: absolute; position: absolute;
top: 10px; top: 10px;
@ -2368,6 +2364,8 @@ pre, code {
background-color: #45a049; background-color: #45a049;
} }
}
#chat-form { #chat-form {
padding: 10px; padding: 10px;
background-color: #252525; background-color: #252525;
@ -2386,11 +2384,7 @@ pre, code {
margin-bottom: 5px; margin-bottom: 5px;
} }
} }
}

View file

@ -112,9 +112,8 @@
<div class="col left-col" style="width: 66%;"> <div class="col left-col" style="width: 66%;">
<div id="editor"><h3>Loading...</h3></div> <div id="editor"><h3>Loading...</h3></div>
</div> </div>
<div class="col right-col" style="width: 33%;"> <div class="col right-col chat-container" style="width: 33%;">
<div class="resize-handle"></div> <div class="resize-handle"></div>
<div class="chat-container">
<div id="chat-box" class="chat-box"> <div id="chat-box" class="chat-box">
<div class="bot-message message"> <div class="bot-message message">
<img src="/img/plaincat.svg" style="width: 30px; margin-bottom: 10px;"> <img src="/img/plaincat.svg" style="width: 30px; margin-bottom: 10px;">
@ -133,7 +132,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<script src="/js/ace/ace.js" type="text/javascript" charset="utf-8"></script> <script src="/js/ace/ace.js" type="text/javascript" charset="utf-8"></script>