Kinou/my_website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed header css

Browse Source
This commit is contained in:
kinou-p 2024-05-12 14:00:09 +02:00
parent eeb8aaceb3
commit f12c49f7f4
5 changed files with 35 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
my-app/src/components/header.tsx
View File

@ -3,7 +3,7 @@ import MaterialUISwitch from './switch'
import { useTheme, ThemeProvider, createTheme } from '@mui/material/styles'; import { useTheme, ThemeProvider, createTheme } from '@mui/material/styles';
import React, { useState, useContext} from "react"; import React, { useState, useContext} from "react";
import { useEffect } from "react"; import { useEffect } from "react";
import logo from '../img/first.jpg'; import logo from '../img/logo.png';
import { ColorModeContext } from '../utils/color-toggle'; import { ColorModeContext } from '../utils/color-toggle';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@ -69,18 +69,24 @@ function Header()
<a className="logo" href="/"> <a className="logo" href="/">
<img src={logo} alt="Logo" /> <img src={logo} alt="Logo" />
</a> </a>
<div className="pages">
<a href="/contact">{t("page1")}</a> <div className="menu">
</div> <div className="pages">
<div className="pages"> <a href="/projects">{t("page2")}</a>
<a href="/projects">{t("page2")}</a> </div>
</div> <div className="pages">
<div className="pages"> <a href="/skills">{t("page4")}</a>
<a href="/resume">{t("page3")}</a> </div>
</div> <div className="pages">
<div className="pages"> <a href="/contact">{t("page1")}</a>
<a href="/skills">{t("page4")}</a> </div>
<div className="pages">
<a href="/resume">{t("page3")}</a>
</div>
</div> </div>
<div className="language"> <div className="language">
{/* <MenuSimple/> */} {/* <MenuSimple/> */}
<Box sx={{ minWidth: 120 }}> <Box sx={{ minWidth: 120 }}>

2
my-app/src/css/contact.css
View File

@ -16,7 +16,7 @@
margin-bottom: 5vh; margin-bottom: 5vh;
} }
.contact_list{ .contact_list {
font-size: 1vw; font-size: 1vw;
font-weight: 800; font-weight: 800;
margin-top: 1vh; margin-top: 1vh;

23
my-app/src/css/mine.css
View File

@ -54,10 +54,12 @@ body {
justify-content: space-between; justify-content: space-between;
} }
.logo img{ .logo{
background-color: black;
height: 100%; /* Adjust the size as needed */ height: 100%; /* Adjust the size as needed */
margin-left: 3vw; /* width: 50%; */
margin-right: 20vw; /* margin-left: 3vw; */
/* margin-right: 20vw; */
margin-bottom: 1vh; margin-bottom: 1vh;
} }
@ -74,6 +76,16 @@ body {
} }
} }
.menu {
display: flex;
flex-direction: row;
width: 50vw;
margin-right: 7vw;
/* align-self: flex-end; */
justify-content: right;
/* float: right; */
}
.title { .title {
color:black; color:black;
font-weight: 800; font-weight: 800;
@ -81,16 +93,13 @@ body {
margin-right: 98vw; margin-right: 98vw;
} }
.menu {
float: right;
}
.language { .language {
align-items: center; align-items: center;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: right; justify-content: right;
width: 50vw; width: 20vw;
margin-top: 0vh; margin-top: 0vh;
margin-left: 0vw; margin-left: 0vw;
height: 100%; height: 100%;

BIN
my-app/src/img/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 96 KiB

BIN
my-app/src/img/omv_dashboard.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 228 KiB

After

Width:  |  Height:  |  Size: 237 KiB