Skip to content

Commit

Permalink
added top navigation bar
Browse files Browse the repository at this point in the history
  • Loading branch information
@yzabeast1
yzabeast1 committed Jul 10, 2024
1 parent a727c53 commit a4abb36
Show file tree
Hide file tree
Showing 2 changed files with 107 additions and 29 deletions.
70 changes: 41 additions & 29 deletions webUI/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,18 @@
<script>
const textures = [{src: "images/blocks/stone.png", probability: 0.618 },{ src: "images/blocks/copper_ore.png", probability: 0.128 },{ src: "images/blocks/coal_ore.png", probability: 0.128 },{ src: "images/blocks/iron_ore.png", probability: 0.064 },{ src: "images/blocks/lapis_ore.png", probability: 0.032 },{ src: "images/blocks/redstone_ore.png", probability: 0.016 },{ src: "images/blocks/gold_ore.png", probability: 0.008 },{ src: "images/blocks/emerald_ore.png", probability: 0.004 },{ src: "images/blocks/diamond_ore.png", probability: 0.002 }];function selectTexture() {const rand = Math.random();let cumulativeProbability = 0;for (const texture of textures) {cumulativeProbability += texture.probability;if (rand < cumulativeProbability) {return texture.src;}}}function createTiles() {const container = document.getElementById("background-container");const numColumns = Math.ceil(window.innerWidth / 100) + 2;const numRows = Math.ceil(window.innerHeight / 100) + 2;container.innerHTML = "";for (let i = 0; i < numColumns; i++) {const rowDiv = document.createElement("div");rowDiv.className = "row";for (let j = 0; j < numRows; j++) {const tile = document.createElement("div");tile.className = "tile";tile.style.backgroundImage = `url("${selectTexture()}")`;rowDiv.appendChild(tile);}container.appendChild(rowDiv);}}createTiles();window.addEventListener("resize", () => {document.getElementById("background-container").innerHTML = "";createTiles();});
</script>
<ul class="large-nav">
<li><a class="nav-link" href="https://becomtweaks.github.io">Home</a></li>
<li style="float:right"><a class="nav-link" href="https://becomtweaks.github.io/crafting-tweaks">Crafting Tweaks</a></li>
<li style="float:right"><a class="nav-link" href="https://becomtweaks.github.io/behaviour-packs">Behaviour Packs</a></li>
<li style="float:right"><a class="nav-link" href="https://becomtweaks.github.io/resource-packs">Resource Packs</a></li>
</ul>
<ul class="small-nav">
<li><a class="nav-link" href="https://becomtweaks.github.io">Home</a></li>
<li style="float:right"><a class="nav-link" href="https://becomtweaks.github.io/crafting-tweaks">CT's</a></li>
<li style="float:right"><a class="nav-link" href="https://becomtweaks.github.io/behaviour-packs">BP's</a></li>
<li style="float:right"><a class="nav-link" href="https://becomtweaks.github.io/resource-packs">RP's</a></li>
</ul>
<div class="container">
<!-- Categories -->
<div class="category">
Expand Down Expand Up @@ -3702,7 +3714,7 @@
Ocean
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of the ocean. (from 1.13)
Replaces the default Minecraft menu panorama with a 360� view of the ocean. (from 1.13)
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3718,7 +3730,7 @@
Village
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a village. (from 1.14)
Replaces the default Minecraft menu panorama with a 360� view of a village. (from 1.14)
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3734,7 +3746,7 @@
Bees
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a group of happy bees! (from 1.15)
Replaces the default Minecraft menu panorama with a 360� view of a group of happy bees! (from 1.15)
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3750,7 +3762,7 @@
Nether
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of the Nether! (from 1.16)
Replaces the default Minecraft menu panorama with a 360� view of the Nether! (from 1.16)
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3766,7 +3778,7 @@
Amethyst Geode
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of an amethyst geode! (from 1.17)
Replaces the default Minecraft menu panorama with a 360� view of an amethyst geode! (from 1.17)
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3782,7 +3794,7 @@
Sunset Valley
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a valley under the setting sun! (from 1.18)
Replaces the default Minecraft menu panorama with a 360� view of a valley under the setting sun! (from 1.18)
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3798,7 +3810,7 @@
Mangrove Swamp
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a mangrove swamp from 1.19
Replaces the default Minecraft menu panorama with a 360� view of a mangrove swamp from 1.19
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3814,7 +3826,7 @@
The End
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of the main End island.
Replaces the default Minecraft menu panorama with a 360� view of the main End island.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3830,7 +3842,7 @@
pack.png
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of the classic and iconic 'pack.png' location.
Replaces the default Minecraft menu panorama with a 360� view of the classic and iconic 'pack.png' location.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3846,7 +3858,7 @@
Nostalgia
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a neon green plains biome from Alpha.
Replaces the default Minecraft menu panorama with a 360� view of a neon green plains biome from Alpha.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3862,7 +3874,7 @@
Oceanside Extreme Hills
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of an Oceanside Extreme Hills.
Replaces the default Minecraft menu panorama with a 360� view of an Oceanside Extreme Hills.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3878,7 +3890,7 @@
Lakeside Sunset
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a Lakeside Sunset.
Replaces the default Minecraft menu panorama with a 360� view of a Lakeside Sunset.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3894,7 +3906,7 @@
Underground Lava Pool
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of an underground lava pool.
Replaces the default Minecraft menu panorama with a 360� view of an underground lava pool.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3910,7 +3922,7 @@
Acacia Village
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of an Acacia Village
Replaces the default Minecraft menu panorama with a 360� view of an Acacia Village
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3926,7 +3938,7 @@
Cherry Grove
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a Cherry Grove
Replaces the default Minecraft menu panorama with a 360� view of a Cherry Grove
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3942,7 +3954,7 @@
Halloween 2021
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a spooky Halloween town
Replaces the default Minecraft menu panorama with a 360� view of a spooky Halloween town
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3958,7 +3970,7 @@
Halloween 2022
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of a spooky Halloween town
Replaces the default Minecraft menu panorama with a 360� view of a spooky Halloween town
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3974,7 +3986,7 @@
Trial Chambers
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of the Trial Chambers
Replaces the default Minecraft menu panorama with a 360� view of the Trial Chambers
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -3990,7 +4002,7 @@
TU69 Tutorial World (Legacy Console)
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Minecraft: Console Edition TU69's tutorial world.
Replaces the default Minecraft menu panorama with a 360� view of Minecraft: Console Edition TU69's tutorial world.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4006,7 +4018,7 @@
Stridey's RP Development World
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Stridey's resource pack development world.
Replaces the default Minecraft menu panorama with a 360� view of Stridey's resource pack development world.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4022,7 +4034,7 @@
Xisuma's Hermitcraft Base Season 1
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 1.
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 1.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4038,7 +4050,7 @@
Xisuma's Hermitcraft Base Season 2
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 2.
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 2.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4054,7 +4066,7 @@
Xisuma's Hermitcraft Base Season 3
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 3.
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 3.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4070,7 +4082,7 @@
Xisuma's Hermitcraft Base Season 4
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 4.
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 4.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4086,7 +4098,7 @@
Xisuma's Hermitcraft Base Season 5
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 5
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 5
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4102,7 +4114,7 @@
Xisuma's Hermitcraft Base Season 6
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 6.
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 6.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4118,7 +4130,7 @@
Xisuma's Hermitcraft Base Season 7
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 7.
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 7.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4134,7 +4146,7 @@
Xisuma's Hermitcraft Base Season 8
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 8.
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 8.
</div>
</div>
<div class="conf-hover-text">
Expand All @@ -4150,7 +4162,7 @@
Xisuma's Hermitcraft Base Season 9
</label>
<div class="tweak-description">
Replaces the default Minecraft menu panorama with a 360° view of Xisuma's base from Hermitcraft Season 9.
Replaces the default Minecraft menu panorama with a 360� view of Xisuma's base from Hermitcraft Season 9.
</div>
</div>
<div class="conf-hover-text">
Expand Down
66 changes: 66 additions & 0 deletions webUI/resource-pack-page.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -247,6 +247,7 @@ header {
max-height:400px;
}
#title {
margin-top: 35px;
max-width: 100%;
height: auto;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
Expand Down Expand Up @@ -298,4 +299,69 @@ header {
top: 100px;
width: 300px;
}
.large-nav {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
position: fixed;
top: 0;
width: 100%;
z-index: 3;
}
}
@media (max-width: 767px){
.large-nav {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
position: fixed;
top: 0;
width: 100%;
z-index: -1;
}
}
.small-nav {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
position: fixed;
top: 0;
width: 100%;
z-index: 2;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.nav-link:link {
color: white;
background-color: transparent;
text-decoration: none;
}
.nav-link:visited {
color: white;
background-color: transparent;
text-decoration: none;
}
.nav-link:hover {
color: white;
background-color: transparent;
text-decoration: underline;
}
.nav-link:active {
color: white;
background-color: transparent;
text-decoration: underline;
}

6 comments on commit a4abb36

@NSPC911
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the degree sign i swear

@yzabeast1
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

vscode doesn't even show that anything was changed before I made the commit other then the top nav bar

@NSPC911
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk then, i have to rerun pre_commit.py

@yzabeast1
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i should be able to fix it

@NSPC911
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yeah but need to update pre_commit.py for your addition

@yzabeast1
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

oops ill fix that now

Please sign in to comment.