pro/2022_WEBSITE_kosmopolit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

reglages navbar

Browse Source
This commit is contained in:
hugogogo
2021-03-11 14:14:09 +01:00
parent 45f2fc1af7
commit 59c72f87dc
5 changed files with 53 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
styles/skeleton.css vendored
View File

@@ -70,47 +70,9 @@ body nav {
flex-direction: row;
/*we have to set the height to use the height % for childs elements*/
height: var(--nav-height);
width: 100%;
border-bottom: 1px solid lightgrey;
background-color: var(--base-back-color);
z-index: 10;
}
body nav * {
display: flex;
flex-direction: row;
margin: auto;
max-height: 100%;
}
/* nav_left is used for links to pages*/
body nav .nav_left {
/*we have to set the height to use the height % for childs elements*/
height: 100%;
margin-left: 0px;
margin-right: auto;
}
/* special settings for the logo*/
body nav a.nav_logo {
padding: 0px;
width: var(--aside-left-width);
}
body nav a.nav_logo img {
height: calc(var(--nav-height) - 5px);
}
/* nav_right is used for actions such as connection, search or language*/
body nav .nav_right {
height: 100%;
margin-left: auto;
margin-right: 0px;
}
/* appearence on hover and click*/
body nav a {
/*gap-unit * 1.5 because there are 2 * (1/2) for aside and (1/2) for main*/
padding: 0px calc(var(--gap-unit) * 1.5);
height: 100%;
}
body nav a:hover, body nav a:focus {
background-color: lightgrey;
}
/*CONTAINER*/
body .container_main {
@@ -125,11 +87,10 @@ body .container_main {
body aside.page_content {
top: calc(var(--nav-height) + 1px);
height: calc(100vh - var(--nav-height));
margin-right: var(--aside-margin);
}
/* asides elements only have width if they have a child*/
body aside.page_content .table_box {
width: calc(var(--aside-left-width) - 2 * var(--aside-margin));
width: var(--aside-left-width);
margin: var(--aside-margin) 0px var(--aside-margin) var(--aside-margin);
/*border-box so changing padding has no effect on total width*/
box-sizing: border-box;