Style changes and cleanup

This commit is contained in:
Stelian Tsekov 2024-03-06 16:04:17 +01:00
parent 70eb1056a1
commit 63fa3f899f
3 changed files with 47 additions and 49 deletions

View file

@ -6,14 +6,8 @@ body {
margin: 0; margin: 0;
padding: 0em; padding: 0em;
height: 100%; height: 100%;
/* overflow: auto; */
/* width: 100vh; */
} }
/* button.button {
padding: 0.5em 1em 0.5em 1em;
} */
nav { nav {
display: flex; display: flex;
gap: 1em; gap: 1em;
@ -21,6 +15,7 @@ nav {
padding: 0.5em; padding: 0.5em;
width: 100%; width: 100%;
transition: all 0.2s ease; transition: all 0.2s ease;
overflow: auto;
z-index: 99; z-index: 99;
} }
@ -28,10 +23,6 @@ nav .button#navButton {
margin: 0; margin: 0;
} }
/* nav .button.primary {
margin-left: auto;
} */
nav > .language-switcher { nav > .language-switcher {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
@ -45,8 +36,8 @@ nav > .language-switcher > select {
} }
nav.scrolled { nav.scrolled {
background: var(--bg-color); /* Change as needed */ background: var(--bg-color);
box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Example shadow, adjust as needed */ box-shadow: 0 2px 4px rgba(0,0,0,0.1);
} }
nav a.nav-logo { nav a.nav-logo {
@ -72,11 +63,17 @@ nav .nav-container {
color: white; color: white;
} }
.content-container {
padding: 1em;
width: 100%;
display: flex;
justify-content: center;
}
.content { .content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/* height: 100vh; */ max-width: 70%;
padding: 1em;
} }
div.notice { div.notice {
@ -87,7 +84,6 @@ div.notice {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
text-align: center; text-align: center;
/* background-color: gray; */
} }
div.notice p { div.notice p {

View file

@ -3,7 +3,7 @@
"links": { "links": {
"git": "Git", "git": "Git",
"forum": "Forum", "forum": "Forum",
"signup": "Sign Up" "signup": "Signup"
} }
}, },
"home": { "home": {

View file

@ -33,42 +33,44 @@
<p data-i18n="home.header.description">A student-driven hub for the students of the Technische Berufsschule Zürich to collaborate and innovate.</p> <p data-i18n="home.header.description">A student-driven hub for the students of the Technische Berufsschule Zürich to collaborate and innovate.</p>
</div> </div>
</div> </div>
<div class="content home"> <div class="content-container">
<section class="services"> <div class="content home">
<h2 data-i18n="home.services.title">Services</h2> <section class="services">
<p class="subtitle" data-i18n="home.services.subtitle">Services hosted by students, for students, at the TBZ.</p> <h2 data-i18n="home.services.title">Services</h2>
<div class="row"> <p class="subtitle" data-i18n="home.services.subtitle">Services hosted by students, for students, at the TBZ.</p>
<div class="col-4 service"> <div class="row">
<h3 data-i18n="home.services.forum.title">Forum</h3> <div class="col-4 service">
<p data-i18n="home.services.forum.description">Join in on the conversation! Our forum is your go-to destination for all things TBZ. Here, we can exchange problems and issues we're facing, and help each other out!</p> <h3 data-i18n="home.services.forum.title">Forum</h3>
<div class="button-container"> <p data-i18n="home.services.forum.description">Join in on the conversation! Our forum is your go-to destination for all things TBZ. Here, we can exchange problems and issues we're facing, and help each other out!</p>
<a class="button primary" href="#" data-i18n="home.buttons.visit">Visit</a> <div class="button-container">
<a class="button primary" href="#" data-i18n="home.buttons.visit">Visit</a>
</div>
</div>
<div class="col-4 service">
<h3 data-i18n="home.services.git.title">Git Forge</h3>
<p data-i18n="home.services.git.description">Collaborate on projects with our Git repository and ditch Gitlab and Github. Powered by Forgejo, you get a massive featureset and maximum reliability.</p>
<div class="button-container">
<a class="button primary" href="#" data-i18n="home.buttons.visit">Visit</a>
</div>
</div>
<div class="col-4 service">
<h3 data-i18n="home.services.sso.title">SSO</h3>
<p data-i18n="home.services.sso.description">One Account for all things TBZ Community! Log in with a singular account, and forget to re-set passwords individually (because you don't have to, anymore).</p>
<div class="button-container">
<a class="button primary" href="#" data-i18n="home.buttons.visit">Visit</a>
</div>
</div> </div>
</div> </div>
<div class="col-4 service"> </section>
<h3 data-i18n="home.services.git.title">Git Forge</h3> <section class="join">
<p data-i18n="home.services.git.description">Collaborate on projects with our Git repository and ditch Gitlab and Github. Powered by Forgejo, you get a massive featureset and maximum reliability.</p> <h2 data-i18n="home.join.title">What're you waiting for?</h2>
<div class="button-container"> <p class="subtitle" data-i18n="home.join.subtitle">Ready to dive in? Join us now and start contributing to the TBZ Community Hub.</p>
<a class="button primary" href="#" data-i18n="home.buttons.visit">Visit</a> <div class="button-container">
</div> <a class="button primary" href="/signup/" data-i18n="home.buttons.join">Join us</a>
<a class="button secondary" href="#" data-i18n="home.buttons.explore">Explore Projects</a>
</div> </div>
<div class="col-4 service"> </section>
<h3 data-i18n="home.services.sso.title">SSO</h3> </div>
<p data-i18n="home.services.sso.description">One Account for all things TBZ Community! Log in with a singular account, and forget to re-set passwords individually (because you don't have to, anymore).</p>
<div class="button-container">
<a class="button primary" href="#" data-i18n="home.buttons.visit">Visit</a>
</div>
</div>
</div>
</section>
<section class="join">
<h2 data-i18n="home.join.title">What're you waiting for?</h2>
<p class="subtitle" data-i18n="home.join.subtitle">Ready to dive in? Join us now and start contributing to the TBZ Community Hub.</p>
<div class="button-container">
<a class="button primary" href="/signup/" data-i18n="home.buttons.join">Join us</a>
<a class="button secondary" href="#" data-i18n="home.buttons.explore">Explore Projects</a>
</div>
</section>
</div> </div>
<footer> <footer>
<div class="notice"> <div class="notice">