feat: add version display to UI and API
Some checks failed
Basil CI/CD Pipeline / Shared Package Tests (pull_request) Successful in 1m15s
Basil CI/CD Pipeline / Code Linting (pull_request) Successful in 1m17s
Basil CI/CD Pipeline / Web Tests (pull_request) Successful in 1m29s
Basil CI/CD Pipeline / API Tests (pull_request) Failing after 1m37s
Basil CI/CD Pipeline / Security Scanning (pull_request) Successful in 1m9s
Basil CI/CD Pipeline / Build All Packages (pull_request) Has been skipped
Basil CI/CD Pipeline / E2E Tests (pull_request) Has been skipped
Basil CI/CD Pipeline / Build & Push Docker Images (pull_request) Has been skipped
Basil CI/CD Pipeline / Trigger Deployment (pull_request) Has been skipped
Some checks failed
Basil CI/CD Pipeline / Shared Package Tests (pull_request) Successful in 1m15s
Basil CI/CD Pipeline / Code Linting (pull_request) Successful in 1m17s
Basil CI/CD Pipeline / Web Tests (pull_request) Successful in 1m29s
Basil CI/CD Pipeline / API Tests (pull_request) Failing after 1m37s
Basil CI/CD Pipeline / Security Scanning (pull_request) Successful in 1m9s
Basil CI/CD Pipeline / Build All Packages (pull_request) Has been skipped
Basil CI/CD Pipeline / E2E Tests (pull_request) Has been skipped
Basil CI/CD Pipeline / Build & Push Docker Images (pull_request) Has been skipped
Basil CI/CD Pipeline / Trigger Deployment (pull_request) Has been skipped
## Changes
### Version System
- Added version pattern: YYYY.MM.PATCH (e.g., 2026.01.1)
- Created version.ts files for both API and web packages
- Initial version: 2026.01.1
### Web UI
- Display version in small green text (light green: #90ee90) under Basil logo
- Added hover tooltip showing "Version 2026.01.1"
- Logo link also shows version in title attribute
- Styled with opacity transition for hover effect
### API
- Added /api/version endpoint returning JSON: {"version": "2026.01.1"}
- Updated server startup message to show version
- Console output: "🌿 Basil API server v2026.01.1 running on..."
### CSS Styling
- .logo-container: Flex column layout for logo and version
- .version: 0.65rem font, light green (#90ee90), 0.85 opacity
- Hover increases opacity to 1.0 for better visibility
- Cursor set to "help" to indicate tooltip
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -74,9 +74,16 @@ body {
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.logo-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.15rem;
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.logo a {
|
||||
@@ -88,6 +95,22 @@ body {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.version {
|
||||
font-size: 0.65rem;
|
||||
color: #90ee90;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.5px;
|
||||
cursor: help;
|
||||
align-self: flex-start;
|
||||
margin-left: 0.25rem;
|
||||
opacity: 0.85;
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.version:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
nav {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
|
||||
@@ -16,6 +16,7 @@ import RecipeImport from './pages/RecipeImport';
|
||||
import NewRecipe from './pages/NewRecipe';
|
||||
import UnifiedEditRecipe from './pages/UnifiedEditRecipe';
|
||||
import CookingMode from './pages/CookingMode';
|
||||
import { APP_VERSION } from './version';
|
||||
import './App.css';
|
||||
|
||||
function App() {
|
||||
@@ -26,7 +27,12 @@ function App() {
|
||||
<div className="app">
|
||||
<header className="header">
|
||||
<div className="container">
|
||||
<h1 className="logo"><Link to="/">🌿 Basil</Link></h1>
|
||||
<div className="logo-container">
|
||||
<h1 className="logo">
|
||||
<Link to="/" title={`Basil v${APP_VERSION}`}>🌿 Basil</Link>
|
||||
</h1>
|
||||
<span className="version" title={`Version ${APP_VERSION}`}>v{APP_VERSION}</span>
|
||||
</div>
|
||||
<nav>
|
||||
<Link to="/">Cookbooks</Link>
|
||||
<Link to="/recipes">All Recipes</Link>
|
||||
|
||||
5
packages/web/src/version.ts
Normal file
5
packages/web/src/version.ts
Normal file
@@ -0,0 +1,5 @@
|
||||
/**
|
||||
* Application version following the pattern: YYYY.MM.PATCH
|
||||
* Example: 2026.01.1 (January 2026, patch 1)
|
||||
*/
|
||||
export const APP_VERSION = '2026.01.1';
|
||||
Reference in New Issue
Block a user