freya/xssbook2
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

profile css + other css changes

Browse source
This commit is contained in:
Murphy 2024-04-03 11:29:28 -04:00
parent 740df27069
commit a50b7cd3bc
Signed by: freya
GPG key ID: 744AB800E383AE52
3 changed files with 106 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/public/css/common.css
View file

@ -219,6 +219,7 @@ input.btn:focus {
.nav-center { .nav-center {
position: absolute; position: absolute;
left: 50%; left: 50%;
top: 0;
transform: translateX(-50%); transform: translateX(-50%);
flex: 1; flex: 1;
justify-content: center; justify-content: center;
@ -542,6 +543,8 @@ input:not(:placeholder-shown) + label:not(.static) {
input[type=radio] { input[type=radio] {
padding: 3rem !important; padding: 3rem !important;
width: 1rem !important;
outline: none !important;
} }
.radio { .radio {

46
src/public/css/people.css
View file

@ -14,19 +14,39 @@
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
padding: 1rem 2rem; padding: 1rem 2rem;
display: grid; padding-bottom: 0;
grid-template-columns: 1fr 1fr 1fr; flex-direction: row;
grid-row-gap: 2rem;
grid-auto-rows: 1fr;
flex-direction: column;
align-items: center; align-items: center;
flex-wrap: wrap;
max-width: 90rem; max-width: 90rem;
} }
.profile {
width: 25rem;
}
@media(max-width: 1400px) {
#people-container {
max-width: 70rem;
}
.profile {
width: 25rem;
}
}
@media(max-width: 1000px) {
#people-container {
max-width: 50rem;
}
.profile {
width: 20rem;
}
}
.profile { .profile {
margin: 1rem; margin: 1rem;
text-decoration: none; text-decoration: none;
height: 100%; height: fit-content;
} }
.profile:hover { .profile:hover {
@ -44,20 +64,6 @@
border-radius: .3rem; border-radius: .3rem;
} }
@media(max-width: 1400px) {
#people-container {
max-width: 90rem;
grid-template-columns: 1fr 1fr;
}
}
@media(max-width: 1000px) {
#people-container {
max-width: 50rem;
grid-template-columns: 1fr;
}
}
td:nth-child(1) { td:nth-child(1) {
font-weight: bold; font-weight: bold;
color: var(--subtext); color: var(--subtext);

77
src/public/css/profile.css Normal file
View file

@ -0,0 +1,77 @@
#main-content {
display: flex;
flex-direction: column;
padding: 0;
}
#profile-header {
background-color: var(--surface0);
margin-bottom: 2rem;
}
#profile-header .banner {
width: 100%;
min-height: 20rem;
aspect-ratio: 5;
}
#profile-header .info .pfp-wrapper .pfp,
#profile-header .info .pfp-wrapper .pfp img {
height: 12.5rem;
}
#profile-header .info {
position: relative;
margin-bottom: 6rem;
}
#profile-header .info .pfp-wrapper {
padding: .5rem;
background-color: var(--surface0);
height: fit-content;
border-radius: 100%;
position: absolute;
top: -2.5rem;
left: 2rem;
}
#profile-header .info .content {
margin-left: 17rem;
margin-top: 2rem;
}
#profile-header .info .content .name {
font-size: 2rem;
}
#profile-header > hr {
border-bottom: 1px solid var(--surface1);
height: 0;
margin-bottom: 0;
}
.options {
width: 100%;
height: 3rem;
}
.options .btn {
height: 100%;
width: 10rem;
}
.options .btn span {
width: 100%;
text-align: center;
}
#tab-posts,
#post-container {
width: 40rem;
margin-left: auto;
margin-right: auto;
}
#post-container .post {
margin-bottom: 1rem;
}