Websites/liljudd-website
1
0
Fork 0
Code Issues Pull requests Projects Releases 3 Packages Wiki Activity

feat: kinda finished homepage

Browse source
This commit is contained in:
moonleay 2023-11-09 12:44:18 +01:00
parent 3fa345888a
commit e7a42b121e
4 changed files with 76 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

38
app/util/wrapping_objects.module.css
View file

@ -13,6 +13,7 @@
border-radius: 100%;
max-width: initial;
max-height: initial;
margin: .35rem;
}
.navElem {
@ -20,8 +21,23 @@
flex-direction: column;
align-items: center;
justify-content: center;
transition: .5s;
}
.navElem:hover {
color: rgb(96 59 255) !important;
}
.navElemR {
transition: .5s;
}
.navElemR:hover {
color: rgb(96 59 255) !important;
}
.logoWtxt {
display: flex;
align-items: center;
@ -33,6 +49,11 @@
padding: 3px;
}
.textBx {
display: flex;
align-items: center;
}
.footer {
align-items: center;
margin: 100px 1px 0 0;
@ -56,7 +77,7 @@
max-width: initial;
max-height: initial;
width: 48px;
margin: 0 auto;
margin: 0.5rem auto;
}
.footerNotice {
@ -72,6 +93,9 @@
gap: 20px;
}
.footerTable div {
}
.footerTable h3 {
margin-bottom: 8px;
}
@ -79,6 +103,7 @@
.footerLinks {
display: flex;
flex-direction: column;
align-items: baseline;
}
@ -136,13 +161,22 @@
.grid {
display: grid;
grid-template-columns: repeat(6, 1fr);
/*grid-template-columns: repeat(6, 1fr);*/
grid-template-columns: repeat(8, 1fr);
}
.navElem {
grid-column: span 1;
margin: 0.5rem 0.5rem 0.5rem 0.5rem;
align-items: center;
text-align: center;
}
.navElemR {
grid-column: 8;
margin: 0.5rem 0.5rem 0.5rem 0.5rem;
align-items: center;
text-align: center;
}
.footerIcon {

17
app/util/wrapping_objects.tsx
View file

@ -6,26 +6,23 @@ export function NavBar(){
<ul className={styles.grid}>
<li className={styles.navElem}>
<div className={styles.logoWtxt}>
<img className={`${styles.logo} ${styles.pad3px}`}
src={"https://static.moonleay.net/img/lilJuddWeb/logos/logox256.png"}
alt={"The Bots Logo"}/>
<a className={styles.pad3px} href={"/"} target={"_self"}>li'l Judd</a>
<a className={[styles.pad3px, styles.textBx].join(" ")} href={"/"} target={"_self"}><img className={`${styles.logo} ${styles.pad3px}`}src={"https://static.moonleay.net/img/lilJuddWeb/logos/logox256.png"}alt={"The Bots Logo"}/>li'l Judd</a>
</div>
</li>
<li className={styles.navElem}>
<a href={"/features"} target={"_self"}>Features</a>
<a className={styles.navLink} href={"/features"} target={"_self"}>Features</a>
</li>
<li className={styles.navElem}>
<a href={"/how-do-i"} target={"_self"}>How do I...?</a>
<a className={styles.navLink} href={"/how-do-i"} target={"_self"}>How do I...?</a>
</li>
<li className={styles.navElem}>
<a href={"/stack"} target={"_self"}>The Stack</a>
<a className={styles.navLink} href={"/stack"} target={"_self"}>The Stack</a>
</li>
<li className={styles.navElem}>
<a href={"/about"} target={"_self"}>About</a>
<a className={styles.navLink} href={"/about"} target={"_self"}>About</a>
</li>
<li className={styles.navElem}>
<a href={"https://discord.com/api/oauth2/authorize?client_id=1024410658973941862&permissions=8&scope=bot"}
<li className={styles.navElemR}>
<a className={styles.navLink} href={"https://discord.com/api/oauth2/authorize?client_id=1024410658973941862&permissions=8&scope=bot"}
target={"_blank"}>Invite to your server</a>
</li>
</ul>