Skip to content

Commit

Permalink
Merge pull request #39 from Rayliable/Contact-and-About
Browse files Browse the repository at this point in the history
Final changes
  • Loading branch information
Rayliable authored Mar 25, 2024
2 parents f31124b + 860b344 commit 2ba4e47
Show file tree
Hide file tree
Showing 27 changed files with 213 additions and 567 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Media/user_upload/pfp/Bit2006B-AvatarDrawing.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Media/user_upload/pfp/fer1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Media/user_upload/pfp/token_1_4.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added Media/user_upload/pfp/token_1_5.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
199 changes: 20 additions & 179 deletions home/static/style/AccountStyle.css
Original file line number Diff line number Diff line change
@@ -1,186 +1,27 @@
body {
width: 100%;
margin: 0;
padding: 0;
box-sizing: border-box;
min-height: 100vh;
font-family: Rockwell;
background-color: #7EC4B5;
}

ul {
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
align-items: center;
}

a {
text-decoration: none;
}

.header__wrapper header {
width: 100%;
background: url("/Media/ImgTemp/rec1.png") no-repeat 50% 20% / cover;
min-height: calc(100px + 15vw);

h3 {
font-size: 45px;
text-align: center
}

.header__wrapper .cols__container .left__col {
padding: 25px 20px;
text-align: center;
max-width: 350px;
position: relative;
margin: 0 auto;
}

.header__wrapper .cols__container .left__col .img__container {
position: absolute;
top: -60px;
left: 50%;
transform: translatex(-50%);
}
.header__wrapper .cols__container .left__col .img__container img {
width: 120px;
height: 120px;
object-fit: cover;
border-radius: 50%;
display: block;
box-shadow: 1px 3px 12px rgba(0, 0, 0, 0.18);
}

.header__wrapper .cols__container .left__col h2 {
margin-top: 60px;
font-weight: 600;
font-size: 22px;
margin-bottom: 5px;
}
.header__wrapper .cols__container .left__col p {
font-size: 0.9rem;
color: #818181;
margin: 0;
}
.header__wrapper .cols__container .left__col .about {
justify-content: space-between;
position: relative;
margin: 35px 0;
}
.header__wrapper .cols__container .left__col .about li {
display: flex;
flex-direction: column;
color: black;
font-size: 0.9rem;
}
.header__wrapper .cols__container .left__col .about li span {
color: #1d1d1d;
font-weight: 600;
h4 {
font-size: 20px;
text-align: center
}
.header__wrapper .cols__container .left__col .about:after {
position: absolute;
content: "";
bottom: -16px;
display: block;
background: #cccccc;
height: 1px;
width: 100%;
}
.header__wrapper .cols__container .content p {
font-size: 1rem;
color: #1d1d1d;
line-height: 1.8em;
}
.header__wrapper .cols__container .content ul {
gap: 30px;
justify-content: center;
align-items: center;
margin-top: 25px;
}
.header__wrapper .cols__container .content ul li {
display: flex;
}
.header__wrapper .cols__container .content ul i {
font-size: 1.3rem;
}
.header__wrapper .cols__container .right__col nav {
display: flex;
align-items: center;
padding: 30px 0;
justify-content: space-between;
flex-direction: column;
}
.header__wrapper .cols__container .right__col nav ul {
display: flex;
gap: 20px;
flex-direction: column;
}
.header__wrapper .cols__container .right__col nav ul li a {
text-transform: uppercase;
color: black;
}
.header__wrapper .cols__container .right__col nav ul li:nth-child(1) a {
color: #1d1d1d;
font-weight: 600;
}
.header__wrapper .cols__container .right__col nav button {
background: #EFFFC8;
color: black;
border: none;
padding: 10px 25px;
border-radius: 4px;
cursor: pointer;
margin-top: 20px;
}
.header__wrapper .cols__container .right__col nav button:hover {
opacity: 0.8;
}
.header__wrapper .cols__container .right__col .photos {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
gap: 20px;
}
.header__wrapper .cols__container .right__col .photos img {
max-width: 100%;
display: block;
height: 100%;
object-fit: cover;
}

/* Responsiveness */

@media (min-width: 868px) {
.header__wrapper .cols__container {
max-width: 1200px;
margin: 0 auto;
width: 90%;
justify-content: space-between;
display: grid;
grid-template-columns: 1fr 2fr;
gap: 50px;
}
.header__wrapper .cols__container .left__col {
padding: 25px 0px;
}
.header__wrapper .cols__container .right__col nav ul {
flex-direction: row;
gap: 30px;
}
.header__wrapper .cols__container .right__col .photos {
height: 365px;
overflow: auto;
padding: 0 0 30px;
}
body {
width: 100%;
margin: 0;
padding: 0;
box-sizing: border-box;
min-height: 100vh;
font-family: Rockwell, serif;
background-color: #7EC4B5;
}

@media (min-width: 1017px) {
.header__wrapper .cols__container .left__col {
ul {
list-style-type: none;
margin: 0;
margin-right: auto;
}
.header__wrapper .cols__container .right__col nav {
flex-direction: row;
}
.header__wrapper .cols__container .right__col nav button {
margin-top: 0;
}
}
padding: 0;
display: flex;
align-items: center;
}
Loading

0 comments on commit 2ba4e47

Please sign in to comment.