Use official logo in Goose web (#3012)

Co-authored-by: Sam Bradbury <Sam Bradbury>
This commit is contained in:
Sam Bradbury
2025-06-19 18:47:56 -05:00
committed by GitHub
parent 09a0079094
commit 082dafd55b
3 changed files with 32 additions and 12 deletions

View File

@@ -199,6 +199,16 @@ async fn serve_static(axum::extract::Path(path): axum::extract::Path<String>) ->
include_str!("../../static/script.js"), include_str!("../../static/script.js"),
) )
.into_response(), .into_response(),
"img/logo_dark.png" => (
[("content-type", "image/png")],
include_bytes!("../../../../documentation/static/img/logo_dark.png").to_vec(),
)
.into_response(),
"img/logo_light.png" => (
[("content-type", "image/png")],
include_bytes!("../../../../documentation/static/img/logo_light.png").to_vec(),
)
.into_response(),
_ => (axum::http::StatusCode::NOT_FOUND, "Not found").into_response(), _ => (axum::http::StatusCode::NOT_FOUND, "Not found").into_response(),
} }
} }

View File

@@ -12,13 +12,13 @@
<h1 id="session-title">Goose Chat</h1> <h1 id="session-title">Goose Chat</h1>
<div class="status" id="connection-status">Connecting...</div> <div class="status" id="connection-status">Connecting...</div>
</header> </header>
<div class="chat-container"> <div class="chat-container">
<div class="messages" id="messages"> <div class="messages" id="messages">
<div class="welcome-message"> <div class="welcome-message">
<h2>Welcome to Goose!</h2> <h2>Welcome to Goose!</h2>
<p>I'm your AI assistant. How can I help you today?</p> <p>I'm your AI assistant. How can I help you today?</p>
<div class="suggestion-pills"> <div class="suggestion-pills">
<div class="suggestion-pill" onclick="sendSuggestion('What can you do?')">What can you do?</div> <div class="suggestion-pill" onclick="sendSuggestion('What can you do?')">What can you do?</div>
<div class="suggestion-pill" onclick="sendSuggestion('Demo writing and reading files')">Demo writing and reading files</div> <div class="suggestion-pill" onclick="sendSuggestion('Demo writing and reading files')">Demo writing and reading files</div>
@@ -28,10 +28,10 @@
</div> </div>
</div> </div>
</div> </div>
<div class="input-container"> <div class="input-container">
<textarea <textarea
id="message-input" id="message-input"
placeholder="Type your message here..." placeholder="Type your message here..."
rows="3" rows="3"
autofocus autofocus
@@ -40,7 +40,7 @@
</div> </div>
</div> </div>
</div> </div>
<script src="/static/script.js"></script> <script src="/static/script.js"></script>
</body> </body>
</html> </html>

View File

@@ -50,6 +50,10 @@
--tool-bg: #f8f9fa; --tool-bg: #f8f9fa;
--code-bg: #f5f5f5; --code-bg: #f5f5f5;
} }
header h1::before {
background-image: url('/static/img/logo_light.png');
}
} }
* { * {
@@ -94,8 +98,14 @@ header h1 {
} }
header h1::before { header h1::before {
content: "🪿"; content: "";
font-size: 1.5rem; width: 32px;
height: 32px;
background-image: url('/static/img/logo_dark.png');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: inline-block;
} }
.status { .status {
@@ -460,20 +470,20 @@ header h1::before {
padding: 1rem; padding: 1rem;
gap: 1rem; gap: 1rem;
} }
.message { .message {
max-width: 90%; max-width: 90%;
padding: 0.875rem 1rem; padding: 0.875rem 1rem;
} }
.input-container { .input-container {
padding: 1rem; padding: 1rem;
} }
header { header {
padding: 0.75rem 1rem; padding: 0.75rem 1rem;
} }
.welcome-message { .welcome-message {
padding: 2rem 1rem; padding: 2rem 1rem;
} }