mstoeck3/forensic-pathways
2
0
Fork 0
Code Issues 3 Pull Requests Projects Releases Activity

layout fixes

Browse Source
This commit is contained in:
overcuriousity 2025-08-17 12:09:40 +02:00
parent afbd8d2cd3
commit dd26d45a21
2 changed files with 58 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/AIQueryInterface.astro
View File

@ -50,11 +50,10 @@ const domainAgnosticSoftware = data['domain-agnostic-software'] || [];
<!-- Input Layout -->
<div class="ai-input-layout">
<div class="ai-textarea-section" style="height: 200px">
<div class="ai-textarea-section">
<textarea
id="ai-query-input"
placeholder="Beschreiben Sie Ihr forensisches Szenario..."
class="w-full"
maxlength="2000"
></textarea>
<div id="ai-char-counter" class="text-xs text-secondary text-right mt-1">0/2000</div>

65
src/styles/global.css
View File

@ -1807,11 +1807,44 @@ input[type="checkbox"] {
.ai-textarea-section {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
}
.ai-textarea-section textarea {
width: 100%;
height: 180px;
min-height: 180px;
max-height: 300px;
resize: vertical;
font-size: 0.9375rem;
line-height: 1.5;
padding: 0.75rem;
border: 1px solid var(--color-border);
border-radius: 0.375rem;
background-color: var(--color-bg);
color: var(--color-text);
transition: var(--transition-fast);
flex: 1;
}
.confidence-tooltip {
background: var(--color-bg) !important;
border: 2px solid var(--color-border) !important;
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
z-index: 2000 !important;
}
.ai-textarea-section textarea:focus {
outline: none;
border-color: var(--color-primary);
box-shadow: 0 0 0 3px rgb(37 99 235 / 10%);
}
.ai-suggestions-section {
flex: 0 0 320px;
min-height: 120px;
min-height: 180px;
height: auto;
}
.ai-input-container textarea {
@ -2187,12 +2220,20 @@ input[type="checkbox"] {
border-radius: 1rem;
font-weight: 500;
text-transform: uppercase;
position: relative;
z-index: 1;
}
.tool-rec-priority.high { background-color: var(--color-error); color: white; }
.tool-rec-priority.medium { background-color: var(--color-warning); color: white; }
.tool-rec-priority.low { background-color: var(--color-accent); color: white; }
[data-theme="dark"] .confidence-tooltip {
background: var(--color-bg-secondary) !important;
border-color: var(--color-border) !important;
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4) !important;
}
.tool-rec-justification {
font-size: 0.875rem;
line-height: 1.5;
@ -2611,7 +2652,8 @@ footer {
================================================================= */
.smart-prompting-container {
height: 100%;
height: auto;
min-height: 180px;
animation: smartPromptSlideIn 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
@ -2620,8 +2662,10 @@ footer {
border: 1px solid var(--color-border);
border-radius: 0.5rem;
padding: 1rem;
height: 100%;
min-height: 120px;
height: auto;
min-height: 180px;
max-height: 400px;
overflow-y: auto;
display: flex;
flex-direction: column;
opacity: 0.85;
@ -2661,8 +2705,8 @@ footer {
/* Smart Prompting Hint */
.smart-prompting-hint {
height: 100%;
min-height: 120px;
height: 180px;
min-height: 180px;
display: flex;
align-items: center;
animation: hintFadeIn 0.3s ease-in-out;
@ -3376,8 +3420,8 @@ footer {
.ai-suggestions-section {
flex: 0 0 auto;
width: 100%;
max-width: none;
height: auto;
min-height: 120px;
}
.ai-textarea-section {
@ -3387,6 +3431,11 @@ footer {
min-height: 100px;
}
.ai-textarea-section textarea {
height: 150px;
min-height: 150px;
}
.ai-spotlight-content {
flex-direction: column;
gap: 0.75rem;