added a combined logo+text for easier styling

This commit is contained in:
2025-07-06 16:24:41 +02:00
parent 74707829fe
commit 84a72d5354
4 changed files with 25 additions and 9 deletions

20
src/assets/logotext.svg Normal file
View File

@@ -0,0 +1,20 @@
<svg width="400" height="120" viewBox="0 0 400 120" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="moonGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0" stop-color="darkorchid" />
<stop offset="100" stop-color="darkslateblue" />
</linearGradient>
<mask id="moonMask">
<circle cx="60" cy="60" r="50" fill="white" />
<circle cx="70" cy="50" r="45" fill="black"/>
</mask>
<style type="text/css">
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&amp;display=swap');
</style>
</defs>
<circle cx="60" cy="50%" r="50" fill="url(#moonGradient)" mask="url(#moonMask)" />
<text x="250" y="60%" dominant-baseline="middle" text-anchor="middle"
font-family="'Raleway', sans-serif" font-size="70" fill="url(#moonGradient)" letter-spacing="2">
REMind
</text>
</svg>

After

Width:  |  Height:  |  Size: 953 B

View File

@@ -1,4 +1,4 @@
<svg width="250" height="100" viewBox="0 0 300 100" xmlns="http://www.w3.org/2000/svg">
<svg width="200" height="80" viewBox="0 0 300 100" xmlns="http://www.w3.org/2000/svg">
<defs>
<style type="text/css">
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&amp;display=swap');

Before

Width:  |  Height:  |  Size: 720 B

After

Width:  |  Height:  |  Size: 719 B

View File

@@ -1,6 +1,5 @@
import { useEffect, useState } from 'react';
import logo from '../assets/logo.svg';
import text from '../assets/text.svg';
import logotext from "../assets/logotext.svg";
export default function TopBar() {
const [visible, setVisible] = useState(true);
@@ -67,8 +66,7 @@ export default function TopBar() {
>
<div className="flex items-center justify-between w-full max-w-6xl mx-auto">
<div className="flex items-center">
<img src={logo} alt="REMind Logo" className="h-12 w-12 md:h-16 md:w-16" />
<img src={text} alt="REMind Text" className="h-8 md:h-12 ml-2" />
<img src={logotext} alt="REMind Logo and Text" className="h-16"/>
</div>
<button

View File

@@ -15,8 +15,7 @@ import {
FaVrCardboard,
} from 'react-icons/fa';
import {HiSparkles} from 'react-icons/hi';
import logo from "../assets/logo.svg";
import text from "../assets/text.svg";
import logotext from "../assets/logotext.svg";
interface HomeProps {
isLoggedIn: boolean;
@@ -49,8 +48,7 @@ export default function Home({isLoggedIn, handleLogin}: HomeProps) {
<div className="text-center mb-16 relative z-10">
<div className="animate-pulse flex flex-col items-center mb-12">
<div className="flex items-center justify-around">
<img src={logo} alt="REMind Logo" className="h-32 w-32"/>
<img src={text} alt="REMind Text" className="h-48"/>
<img src={logotext} alt="REMind Logo and Text" className="h-48 mb-4"/>
</div>
<p className="text-xl dreamy-text">Träume analysieren, Gesellschaft verstehen</p>
</div>