first commit
This commit is contained in:
Nadine Eunuos
commit
b35f937a56
BIN
IRS-website/FSFW_Logo.png
Normal file
BIN
IRS-website/FSFW_Logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
IRS-website/cat.jpg
Normal file
BIN
IRS-website/cat.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 366 KiB |
153
IRS-website/index.css
Normal file
153
IRS-website/index.css
Normal file
@ -0,0 +1,153 @@
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.top-nav {
|
||||
padding: 10px 20px;
|
||||
background-color: #2c2c2c;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.navbar img {
|
||||
width: 50px;
|
||||
height: 60px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.top-nav ul {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.top-nav li {
|
||||
font-size: 14px;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.top-nav ul li:not(:last-child) {
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.top-nav a {
|
||||
text-decoration: none;
|
||||
color: #f5f5f5;
|
||||
transition: color 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.top-nav a:hover {
|
||||
color: #ff6600;
|
||||
}
|
||||
|
||||
.side-bar {
|
||||
width: 200px;
|
||||
height: 100%;
|
||||
background-color: #f1f1f1;
|
||||
padding: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.side-bar ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.side-bar li {
|
||||
display: block;
|
||||
color: #000;
|
||||
padding: 8px 10px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.side-bar li:hover {
|
||||
background-color: #555;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.side-bar-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.fsfw-desc {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
#fsfw-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
padding-right: 170px;
|
||||
padding-left: 170px;
|
||||
transform: translateY(90px);
|
||||
}
|
||||
|
||||
#fsfw-links {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.develop a,
|
||||
.master a {
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.develop li,
|
||||
.master li {
|
||||
list-style: none;
|
||||
border: 2px solid #000;
|
||||
margin: 20px;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
width: 160px;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
line-height: 60px;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
.develop li:hover,
|
||||
.master li:hover {
|
||||
background-color: #00beff;
|
||||
}
|
||||
|
||||
.develop li {
|
||||
margin-right: 60px;
|
||||
}
|
||||
|
||||
#sat-rs-content {
|
||||
display:none;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
padding-right: 170px;
|
||||
padding-left: 170px;
|
||||
transform: translateY(90px);
|
||||
}
|
||||
60
IRS-website/index.html
Normal file
60
IRS-website/index.html
Normal file
@ -0,0 +1,60 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>The IRS doc website</title>
|
||||
<link rel="stylesheet" href="index.css" />
|
||||
<script src="index.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<nav class="top-nav">
|
||||
<div class="navbar">
|
||||
<img src="cat.jpg" width="50" height="60" />
|
||||
<ul>
|
||||
<li><a href="#">The IRS documentation website</a></li>
|
||||
<li><a href="#">imprint</a></li>
|
||||
<li><a href="#">protection of privacy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="container">
|
||||
<div class="side-bar-container">
|
||||
<ul class="side-bar">
|
||||
<li id="fsfw-click">FSFW</li>
|
||||
<li id="sat-click">sat-rs</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div id="fsfw-content">
|
||||
<img
|
||||
src="FSFW_Logo.png" width="150" height="60" />
|
||||
<p class="fsfw-desc">FSFW blab la bl abla bla bl fff ff ff ff ffffff ffff ff ff fffff ffffs args dfd fg hdfh gdf tjgf kgi kkkkk kkkk kk kkfd sfd sfdsf dsfssr tzj hl zigfd fdsf fff ffff fff ff ff ff ff f ff fff f ff f ff ff ffff ff f </p>
|
||||
<div id="fsfw-links">
|
||||
<div class="develop">
|
||||
<ul>
|
||||
<li><a href="link" id="fsfw-click">develop</a></li>
|
||||
<li><a href="link">→ coverage</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="master">
|
||||
<ul>
|
||||
<li><a href="link">master</a></li>
|
||||
<li><a href="link">→ coverage</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="sat-rs-content">
|
||||
<h1>sat-rs</h1>
|
||||
<p>sat rs blablablablablabl</p>
|
||||
<ul>
|
||||
<li><a href="link">Link</a></li>
|
||||
<li><a href="link">Link</a></li>
|
||||
<li><a href="link">Link</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
15
IRS-website/index.js
Normal file
15
IRS-website/index.js
Normal file
@ -0,0 +1,15 @@
|
||||
const fsfw_click = document.getElementById("fsfw-click");
|
||||
const sat_click = document.getElementById("sat-click");
|
||||
const sat_content = document.getElementById("sat-rs-content");
|
||||
const fsfw_content = document.getElementById("fsfw-content");
|
||||
|
||||
fsfw_click.addEventListener("click", () => {
|
||||
fsfw_content.style.display = "block"; // Show the fsfw content
|
||||
sat_content.style.display = "none"; // Hide the sat content
|
||||
});
|
||||
|
||||
sat_click.addEventListener("click", () => {
|
||||
fsfw_content.style.display = "none"; // Hide the fsfw content
|
||||
sat_content.style.display = "block"; // Show the sat content
|
||||
|
||||
});
|
||||
8
IRS-website/test.css
Normal file
8
IRS-website/test.css
Normal file
@ -0,0 +1,8 @@
|
||||
/* CSS */
|
||||
#sat-rs-content.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#fsfw-content.visible {
|
||||
display: block;
|
||||
}
|
||||
45
IRS-website/test.html
Normal file
45
IRS-website/test.html
Normal file
@ -0,0 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>The IRS doc website</title>
|
||||
<link rel="stylesheet" href="test.css" />
|
||||
<script src="test.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="side-bar-container">
|
||||
<ul class="side-bar">
|
||||
<li id="fsfw-click">FSFW</li>
|
||||
<li id="sat-click">sat-rs</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div id="fsfw-content" class="visible">
|
||||
<img
|
||||
src="FSFW_Logo.png" width="150" height="60" />
|
||||
<p class="fsfw-desc">FSFW blab la bl abla bla bl fff ff ff ff ffffff ffff ff ff fffff ffffs args dfd fg hdfh gdf tjgf kgi kkkkk kkkk kk kkfd sfd sfdsf dsfssr tzj hl zigfd fdsf fff ffff fff ff ff ff ff f ff fff f ff f ff ff ffff ff f </p>
|
||||
<div id="fsfw-links">
|
||||
<div class="develop">
|
||||
<ul>
|
||||
<li><a href="link">develop</a></li>
|
||||
<li><a href="link">→ coverage</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="master">
|
||||
<ul>
|
||||
<li><a href="link">master</a></li>
|
||||
<li><a href="link">→ coverage</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="sat-rs-content" class="hidden">
|
||||
<h1>sat-rs</h1>
|
||||
<p>sat rs blablablablablabl</p>
|
||||
<ul>
|
||||
<li><a href="link">Link</a></li>
|
||||
<li><a href="link">Link</a></li>
|
||||
<li><a href="link">Link</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
25
IRS-website/test.js
Normal file
25
IRS-website/test.js
Normal file
@ -0,0 +1,25 @@
|
||||
|
||||
const fsfw_click = document.getElementById("fsfw-click");
|
||||
const sat_click = document.getElementById("sat-click");
|
||||
const sat_content = document.getElementById("sat-rs-content");
|
||||
const fsfw_content = document.getElementById("fsfw-content");
|
||||
|
||||
fsfw_click.addEventListener("click", () => {
|
||||
console.log("Clicked on FSFW");
|
||||
fsfw_content.classList.remove("hidden");
|
||||
fsfw_content.classList.add("visible");
|
||||
|
||||
sat_content.classList.remove("visible");
|
||||
sat_content.classList.add("hidden");
|
||||
});
|
||||
|
||||
sat_click.addEventListener("click", () => {
|
||||
console.log("Clicked on sat-rs"); // Check if the click event is triggered
|
||||
fsfw_content.classList.remove("visible");
|
||||
fsfw_content.classList.add("hidden");
|
||||
|
||||
sat_content.classList.remove("hidden");
|
||||
sat_content.classList.add("visible");
|
||||
console.log("fsfw_content.classList:", fsfw_content.classList); // Check the class changes
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user