Skip to content

Commit dcc768e

Browse files
committed
mira ni idea ya
1 parent b45b1a3 commit dcc768e

2 files changed

Lines changed: 71 additions & 21 deletions

File tree

css/style.css

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -124,6 +124,18 @@ body {
124124
margin-right: 10px;
125125
}
126126

127+
.navbar-center-logo {
128+
display: block; /* show on larger screens */
129+
position: absolute;
130+
top: 50%; /* center vertically */
131+
left: 50%; /* center horizontally */
132+
transform: translate(-50%, -50%);
133+
}
134+
135+
.navbar-center-logo img {
136+
height: 40px;
137+
}
138+
127139
.navbar-nav .nav-link-active {
128140
color: var(--bs-light) !important;
129141
position: relative;

index.html

Lines changed: 59 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -42,27 +42,65 @@
4242

4343
<body>
4444
<!-- Navbar -->
45-
<nav class="navbar navbar-expand-lg navbar-dark sticky-top">
45+
<nav class="navbar navbar-expand-lg navbar-dark" data-bs-spy="scroll" data-bs-target="#navbarNav" data-bs-root-margin="0px 0px -40%" data-bs-smooth-scroll="true">
4646
<div class="container-fluid">
47-
<a class="navbar-brand text-special d-flex align-items-center" href="index.html">
48-
<img src="img/company_logo.png" alt="Company Logo" class="navbar-logo" />
49-
Against Software
50-
</a>
51-
<!-- central logo for mobile -->
52-
<div class="navbar-center-logo d-lg-none">
53-
<img src="img/stratum_logo_transparent.png" alt="Stratum Logo" />
54-
</div>
55-
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
56-
<span class="navbar-toggler-icon"></span>
57-
</button>
58-
<div class="collapse navbar-collapse" id="navbarNav">
59-
<ul class="navbar-nav ms-auto">
60-
<li class="nav-item"><a class="nav-link active text-special py-2" href="#">Stratum</a></li>
61-
<li class="nav-item"><a class="nav-link text-special py-2" href="#asJoin">Únete / Join</a></li>
62-
<li class="nav-item"><a class="nav-link text-special py-2" href="#asCharacters">Personajes / Characters</a></li>
63-
<li class="nav-item"><a class="nav-link text-special py-2" href="#asRules">Reglas / Rules</a></li>
64-
<li class="nav-item"><a class="nav-link text-special py-2" href="#asFeatures">Características / Features</a></li>
65-
</ul>
47+
<div class="container position-relative">
48+
<div class="d-flex justify-content-between align-items-center w-100">
49+
<a
50+
class="navbar-brand text-special d-flex align-items-center"
51+
href="index.html"
52+
>
53+
<img
54+
src="img/company_logo.png"
55+
alt="Company Logo"
56+
style="height: 30px; margin-right: 10px"
57+
/>
58+
Against Software
59+
</a>
60+
61+
<button
62+
class="navbar-toggler"
63+
type="button"
64+
data-bs-toggle="collapse"
65+
data-bs-target="#navbarNav"
66+
>
67+
<span class="navbar-toggler-icon"></span>
68+
</button>
69+
</div>
70+
71+
<div class="collapse navbar-collapse" id="navbarNav">
72+
<ul class="navbar-nav">
73+
<li class="nav-item">
74+
<a href="#" class="nav-link text-special active py-2"
75+
>Inicio <span class="d-none d-md-inline">/</span>
76+
<span class="english-text">Home</span></a
77+
>
78+
</li>
79+
<li class="nav-item">
80+
<a href="#asStratum" class="nav-link text-special py-2"
81+
>Stratum</a
82+
>
83+
</li>
84+
<li class="nav-item">
85+
<a href="#asManifesto" class="nav-link text-special py-2"
86+
>Manifiesto <span class="d-none d-md-inline">/</span>
87+
<span class="english-text">Manifesto</span></a
88+
>
89+
</li>
90+
<li class="nav-item">
91+
<a href="#asWorks" class="nav-link text-special py-2"
92+
>Trabajos <span class="d-none d-md-inline">/</span>
93+
<span class="english-text">Works</span></a
94+
>
95+
</li>
96+
<li class="nav-item">
97+
<a href="#asTeam" class="nav-link text-special py-2"
98+
>Equipo <span class="d-none d-md-inline">/</span>
99+
<span class="english-text">Team</span></a
100+
>
101+
</li>
102+
</ul>
103+
</div>
66104
</div>
67105
</div>
68106
</nav>
@@ -817,4 +855,4 @@ <h5 class="mb-2">Óscar Alarcón</h5>
817855
<!-- Template Javascript -->
818856
<script src="js/main.js"></script>
819857
</body>
820-
</html>
858+
</html>

0 commit comments

Comments
 (0)