changed layout to remove white border
This commit is contained in:
parent
15c85416c4
commit
98fbd5f6d0
6 changed files with 33 additions and 9 deletions
|
|
@ -1,5 +1,8 @@
|
||||||
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
|
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
|
||||||
|
|
||||||
|
// Import global CSS reset first
|
||||||
|
import './index.css';
|
||||||
|
|
||||||
import Login from './pages/Login';
|
import Login from './pages/Login';
|
||||||
import Register from './pages/Register';
|
import Register from './pages/Register';
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -5,15 +5,18 @@
|
||||||
background: var(--color-bg);
|
background: var(--color-bg);
|
||||||
box-shadow: 0px 2px 6px 0px rgba(194, 194, 194, 0.10);
|
box-shadow: 0px 2px 6px 0px rgba(194, 194, 194, 0.10);
|
||||||
width: 240px;
|
width: 240px;
|
||||||
flex-shrink: 0;
|
|
||||||
margin-top: 51px;
|
margin-top: 51px;
|
||||||
margin-left: 49px;
|
margin-left: 49px;
|
||||||
padding-bottom: 1px;
|
padding-bottom: 1px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 200px;
|
width: 240px;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
|
|
|
||||||
|
|
@ -50,7 +50,7 @@ const useSidebarData = () => {
|
||||||
{
|
{
|
||||||
id: '7',
|
id: '7',
|
||||||
name: 'Settings',
|
name: 'Settings',
|
||||||
link: 'einstellungen',
|
link: '/einstellungen',
|
||||||
icon: GoGear,
|
icon: GoGear,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
.user_section {
|
.user_section {
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 200px;
|
width: 240px;
|
||||||
height: auto;
|
height: auto;
|
||||||
min-height: 100px;
|
min-height: 100px;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
|
|
|
||||||
18
src/index.css
Normal file
18
src/index.css
Normal file
|
|
@ -0,0 +1,18 @@
|
||||||
|
/* Global CSS Reset */
|
||||||
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
html, body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
#root {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
@ -1,14 +1,13 @@
|
||||||
.homeContainer {
|
.homeContainer {
|
||||||
position: relative;
|
position: relative;
|
||||||
background-color: var(--color-surface);
|
background-color: var(--color-surface);
|
||||||
min-height: calc(100vh - 15px);
|
min-height: 100vh;
|
||||||
max-height: calc(100vh - 15px);
|
max-height: 100vh;
|
||||||
width: 100%;
|
width: 100vw;
|
||||||
font-family: var(--font-family);
|
font-family: var(--font-family);
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 0 49px 0 36px;
|
padding: 0 49px 0 0;
|
||||||
width: calc(100% - 49px - 36px);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.homeContainer::before {
|
.homeContainer::before {
|
||||||
|
|
@ -34,4 +33,5 @@
|
||||||
.body {
|
.body {
|
||||||
display: flex;
|
display: flex;
|
||||||
max-width: 100vw;
|
max-width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
}
|
}
|
||||||
Loading…
Reference in a new issue