/
home
/
obinna
/
html
/
cravings
/
public
/
css
/
Upload File
HOME
h1, h2, h3, h4, h5, h6, ul { margin: 0; padding: 0; } .wrapper { width: 100%; } .reviewing { width: 100%; margin: 0 auto; display: grid; grid-template-columns: 60% 40%; } .review-feed { width: 400px; margin-left: auto; } .user-details { padding-left: 60px; } .user-info { padding-bottom: 20px; } .profile-details { text-align: center; width: max-content; padding: 10px; } .profile-pic img { width: 100px; border-radius: 50%; } .profile-info .profile-name { font-size: 1.2rem; } .review-item{ width: 100%; /*display: grid; grid-template-rows: 50% auto;*/ height: 100%; /*min-height: 100vh;*/ padding-top: 20px; padding-bottom: 20px; box-sizing: border-box; border-top: 1px solid #ccc; } .review-item:first-of-type { padding-top: 0; padding-bottom: 20px; border-top: none; } hr { margin: 0; } .review-image { width: 100%; min-height: 200px; background: #e8e8e8; } .review-image img { width: 100%; } .review-comment { padding: 0 8px; } .review-item__name { padding: 10px 0 0; } .review-item__place__name { padding-left: 10px; } .review-comment hr { border-color: #222; } .review-item__user { display: flex; justify-content: space-between; /*grid-template-columns: 70% 30%;*/ /*padding: 10px 0;*/ align-items: center; text-align: right; padding: 0 8px; } .review-item__user img { width: 50px; border-radius: 50%; margin-left: 10px; } .review-item__user__name { text-align: left; font-size: 20px; /*padding-left: 20px;*/ } .new-review { position: fixed; bottom: 55px; right: 15px; padding: 5px; border-radius: 50%; background-color: #eee; color: #1e1d23; } .new-review a { font-size: 35px; } p { padding: 0; margin: 0; } .profile-details img { width: 70px; } .profile-content { padding-top: 10px; } .login { display: flex; text-align: center; justify-content: center; padding-top: 10px; } .login .social-icon { padding-right: 5px; } .login .social-icon:last-of-type { padding-right: 0; } .login img { width: 30px; } .reviewer-name { display: block; text-align: left; } .review-food__name { /* color: var(--red); */ font-family: 'GilroyItalic', sans-serif; } .place-name { font-size: 0.9rem; font-family: 'Gilroy Semi Bold', sans-serif; } .right-side { padding: 10px; } .footers { width: 100%; justify-content: space-evenly; background: #fff; z-index: 1200; } .footers-link { text-align: center; /* border-right: 2px solid #ccc; */ border-top: 1px solid #ccc; width: 100%; cursor: pointer; font-size: 18px; padding: 10px 0; display: flex; } .footers-link:last-of-type { border-right: none; } .footers-link>* { margin: auto; } .review { width: 30%; margin-left: 20px; } .review-main { padding: 10px; border-radius: 15px; background: #fff; margin-bottom: 10px; /*display: grid;*/ /*grid-template-rows: 150px 150px */ } .review-header { display: grid; width: 100%; grid-template-columns: 20% auto 15px; align-items: center; margin-bottom: 10px; /*height: 70px;*/ } .profile-dp img { width: 50px; height: 50px; border-radius: 50%; } .profile-info p { font-size: 80%; } .review-image { width: 100%; height: 250px; /* background-image: url('bg.jpg'); */ background-position: center; background-size: cover; border-radius: 15px; margin-top: 10px; } .review-footer { display: flex; justify-content: space-between; } .left-side, .right-side { padding: 10px 0; } .review-footer a { color: #ccc; font-size: 20px; text-decoration: none; } .review-footer .left-side a:first-of-type { padding-right: 10px; } @media (max-width: 950px) { .reviewing { grid-template-columns: 65% 35%; } .user-details { padding-left: 30px; } } @media (max-width: 750px) { .reviewing { grid-template-columns: 70% 30%; } .user-details { padding-left: 20px; } } @media (min-width: 561px){ .review-container { height: 100vh; overflow-y: scroll; overflow-y: scroll; scrollbar-width: none; /* Firefox */ -ms-overflow-style: none; /* Internet Explorer 10+ */ } .review-container::-webkit-scrollbar { /* WebKit */ width: 0; height: 0; } } @media (max-width: 560px) { .reviewing { display: block; width: 98%; margin: 0 auto; } .user-details { display: none; } .review-feed { margin-top: 0; padding-top: 15px; width: 100%; } .review-text { word-break: break-word; } .new-review { display: block; } } @media (max-width: 360px){ .reviewing { width: 96%; } }