cse110-fa22-group29/source/static/homepage.css
2022-12-05 20:01:12 -08:00

128 lines
1.8 KiB
CSS

/* homepage.css */
@font-face {
font-family: testFont;
src: url("CoveredByYourGrace-Regular.ttf");
}
/* Color */
body {
/* background-color: #97a5bd */
/* background-color: #E3E3EC; */
background-color: #f8f3f1;
}
.top-bar {
display: flex;
justify-content: center;
}
.top-bar > img {
position: relative;
align-self: center;
padding-left: 2.5%;
padding-right: 2.5%;
width: 7.5%;
height: 7.5%;
}
.top-bar > h1 {
position: relative;
text-align: center;
/* color: #e4c3d2; */
/* color: rgb(145, 124, 175); */
color: #516754;
font-size: 6rem;
font-family: testFont, sans-serif;
}
.body-container {
display: flex;
max-height: 100%;
}
.center-display {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.search-bar {
display: flex;
justify-content: center;
font-family: "Century Gothic", sans-serif;
font-weight: bold;
color: #516754;
}
#sort {
margin-right: 1em;
}
.search-bar > form {
float: right;
padding: 6px 10px;
/*
margin-top: 8px;
margin-right: 16px;
*/
background: rgb(239 183 183);
font-size: 17px;
border: none;
border-radius: 12px;
}
#search-btn {
position: relative;
align-self: center;
width: 30px;
height: 30px;
}
#recent-reviews-text {
text-align: center;
font-size: 4rem;
color: #516754;
font-family: testFont, sans-serif;
}
img#create-btn {
position: relative;
align-self: center;
padding-left: 2.5%;
padding-right: 2.5%;
cursor: pointer;
width: 10%;
height: 10%;
}
img#create-btn-invis {
opacity: 0;
padding-left: 2.5%;
padding-right: 2.5%;
width: 10%;
height: 10%;
}
.review-container {
display: flex;
position: relative;
flex-wrap: wrap;
justify-content: center;
}
.review-container > div {
background-color: #f1f1f1;
text-align: center;
}
footer {
display: flex;
justify-content: center;
}