added a combined logo+text for easier styling
This commit is contained in:
20
src/assets/logotext.svg
Normal file
20
src/assets/logotext.svg
Normal 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&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 |
@@ -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&display=swap');
|
||||
|
Before Width: | Height: | Size: 720 B After Width: | Height: | Size: 719 B |
@@ -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
|
||||
|
@@ -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>
|
||||
|
Reference in New Issue
Block a user