niklas.ortmann/webprogrammierung
0
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

navbar.php + navbar.css update

Browse Source
This commit is contained in:
NOrtmann1
2026-05-10 14:23:03 +02:00
parent 8fe32f6245
commit 6e449912ab
2 changed files with 89 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/navbar.css
+3 -7
View File
@@ -1,3 +1,6 @@
/*
CSS für den Block Navbar mit seinen Elementen nach BEM
*/
.nav { .nav {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -50,13 +53,6 @@
text-decoration: none; text-decoration: none;
} }
.nav__link:not(:last-child)::after,
.nav__dropdown:not(:last-child)::after {
content: '|';
margin: 0 0.75rem;
color: #ccc;
}
/* CSS von https://responsivenavigation.net/examples/simple-toggle/ */ /* CSS von https://responsivenavigation.net/examples/simple-toggle/ */
/* /*
.nav { width:100%; background-color: #fff; border-bottom: 1px solid #ccc; } .nav { width:100%; background-color: #fff; border-bottom: 1px solid #ccc; }
includes/navbar.php
+86 -64
View File
@@ -2,72 +2,94 @@
Globales Menü, wird via PHP später in alle Seiten eingebunden Globales Menü, wird via PHP später in alle Seiten eingebunden
--> -->
<nav class="nav"> <nav class="nav">
<div style="float:left; text-align: center;"> <div class="nav__left">
<a href="index.php"> <a href="index.php" class="nav_logo">
<img src="images/logo.png" alt="" style="height: 44px;"> <img src="images/logo.png" alt="Logo" style="height: 44px;">
</a> </a>
|
<div style="padding:5px;text-align:center;display:inline-block;">
<b>Sprachen</b>
<div style="display:none;">
<a href="content/deutsch.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Deutsch</b></a>
<a href="content/englisch.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Englisch</b></a>
<a href="content/franzoesisch.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Französisch</b></a>
<a href="content/latein.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Latein</b></a>
<a href="content/literatur.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Literatur</b></a>
</div>
</div> </div>
|
<div style="padding:5px;text-align:center;display:inline-block;">
<b>MINT</b>
<div style="display:none;">
<a href="content/mathematik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Mathematik</b></a>
<a href="content/biologie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Biologie</b></a>
<a href="content/chemie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Chemie</b></a>
<a href="content/physik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Physik</b></a>
<a href="content/informatik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Informatik</b></a>
<a href="content/astronomie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Astronomie</b></a>
<a href="content/technik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Technik</b></a>
</div>
</div>
|
<div style="padding:5px;text-align:center;display:inline-block;">
<b>Gesellschaft & Werte</b>
<div style="display:none;">
<a href="content/geschichte.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Geschichte</b></a>
<a href="content/erdkunde.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Erdkunde</b></a>
<a href="content/sozialkunde.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Sozialkunde</b></a>
<a href="content/wirtschaftskunde.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Wirtschaftskunde</b></a>
<a href="content/religion.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Religion</b></a>
<a href="content/ethik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Ethikunterricht</b></a>
<a href="content/philosophie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Philosophie</b></a>
<a href="content/psychologie.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Psychologie</b></a>
<a href="content/kunst.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Kunst</b></a>
<a href="content/musik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Musik</b></a>
<a href="content/theater.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Theater</b></a>
</div>
</div>
|
<div style="padding:5px;text-align:center;display:inline-block;">
<b>Technik & Praxis</b>
<div style="display:none;">
<a href="content/technik.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Technik</b></a>
<a href="content/werken.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Werken</b></a>
<a href="content/hauswirtschaft.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Hauswirtschaft</b></a>
<a href="content/sport.php" style="display:block;padding:5px;text-align:center;text-decoration:none;"><b>Sport</b></a>
</div>
</div>
|
<a href = "content/profile.php" style = "padding: 5px; text-align: center; text-decoration: none; display: inline-block;"><b>Dein Profil</b></a>
|
</div>
<div style="float:right; text-align: center;">
<?php
include_once 'search.php';
?>
|
<a href = "auth/login.php" style = "background-color: #f44336; color: white; padding: 4px 20px; text-align: center; text-decoration: none; display: inline-block;"> Anmelden </a>
<a href = "auth/register.php" style = "background-color: #f44336; color: white; padding: 4px 20px; text-align: center; text-decoration: none; display: inline-block;"> Registrieren </a> <div class="nav__center">
<div class="nav__item nav__dropdown">
<button class="nav__dropdown-toggle">Sprachen</button>
<div class="nav__dropdown-menu">
<a href="content/deutsch.php">Deutsch</a>
|
<a href="content/englisch.php">Englisch</a>
|
<a href="content/franzoesisch.php">Französisch</a>
|
<a href="content/latein.php">Latein</a>
|
<a href="content/literatur.php">Literatur</a>
</div>
</div>
<div class="nav__item nav__dropdown">
<button class="nav__dropdown-toggle">MINT</button>
<div class="nav__dropdown-menu">
<a href="content/mathematik.php">Mathematik</a>
|
<a href="content/biologie.php">Biologie</a>
|
<a href="content/chemie.php">Chemie</a>
|
<a href="content/physik.php">Physik</a>
|
<a href="content/informatik.php">Informatik</a>
|
<a href="content/astronomie.php">Astronomie</a></div>
</div>
</div>
<div class="nav__item nav__dropdown">
<button class="nav__dropdown-toggle">Gesellschaft & Werte</button>
<div class="nav__dropdown-menu">
<a href="content/geschichte.php">Geschichte</a>
|
<a href="content/erdkunde.php">Erdkunde</a>
|
<a href="content/sozialkunde.php">Sozialkunde</a>
|
<a href="content/wirtschaftskunde.php">Wirtschaftskunde</a>
|
<a href="content/religion.php">Religion</a>
|
<a href="content/ethik.php">Ethikunterricht</a>
|
<a href="content/philosophie.php">Philosophie</a>
|
<a href="content/psychologie.php">Psychologie</a>
|
<a href="content/kunst.php">Kunst</a>
|
<a href="content/musik.php">Musik</a>
|
<a href="content/theater.php">Theater</a>
</div>
</div>
<div class="nav__item nav__dropdown">
<button class="nav__dropdown-toggle">Technik & Praxis</button>
<div class="nav__dropdown-menu">
<a href="content/technik.php">Technik</a>
|
<a href="content/werken.php">Werken</a>
|
<a href="content/hauswirtschaft.php">Hauswirtschaft</a>
|
<a href="content/sport.php">Sport</a>
</div>
</div>
</div>
<div class="nav__right">
<a href = "content/profile.php" style = "padding: 5px; text-align: center; text-decoration: none; display: inline-block;"><b>Dein Profil</b></a>
|
<div class="nav__search">
<?php
include_once 'search.php';
?>
</div>
|
<a href = "auth/login.php" style = "background-color: #f44336; color: white; padding: 4px 20px; text-align: center; text-decoration: none; display: inline-block;"> Anmelden </a>
|
<a href = "auth/register.php" style = "background-color: #f44336; color: white; padding: 4px 20px; text-align: center; text-decoration: none; display: inline-block;"> Registrieren </a>
</div> </div>
</nav> </nav>