Files
WebDB/website/public/styles/profile.css
2017-02-02 14:57:50 +01:00

155 lines
2.4 KiB
CSS

/* New */
.alertbox {
display: none;
background-color: firebrick;
}
.user-box {
text-align: center;
}
.status-buttons-container {
position: relative;
float: left;
width: 200px;
display: inline-block;
}
.friend-button-container, .group-button-container {
position: relative;
float: right;
width: 200px;
display: inline-block;
}
.friend-button-container button, .status-buttons-container button, .group-button-container button {
display: block;
margin: 7px 0;
width: 200px;
font-size: 18px;
}
.group-button-container button {
float: right;
}
.empty-button {
background: none;
cursor: auto;
}
.empty-button:active {
box-shadow: none;
}
.profile-info {
display: inline-block;
min-width: 250px;
width: auto;
padding-top: 30px;
}
.main-picture {
position: relative;
border-width: 5px;
display: inline-block;
width: 150px;
height: 150px;
margin-bottom: -45px;
object-fit: cover;
vertical-align: middle;
}
.group-picture {
border: none;
margin-right: 15px;
}
/* Old */
.profile-box h1.profile-username {
padding-top: 50px;
}
.profile-box h5.profile-username {
padding: 0 0 10px 0;
}
div.posts {
width: calc(100% + 20px);
display: inline-flex;
}
div.posts div.post {
display: block;
padding: 10px;
width: calc(100% - 40px);
cursor: pointer;
transition-duration: 250ms;
word-wrap: break-word;
}
div.posts div.post a {
text-decoration: underline;
}
div.posts div.post:hover {
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
div.posts div.post img {
width: 100%;
height: auto;
}
div.posts .post p.subscript {
text-align: right;
font-size: 8pt;
}
div.posts .post form input, div.posts .post form textarea {
width: calc(100% - 15px);
}
div.posts .post form input[type="submit"], .post button{
width: 100%;
}
div.posts .post form textarea.newpost {
margin: 15px 0 15px 0;
height: 100px;
}
.post .post-date {
float: right;
color: #aaaaaa;
font-size: 0.8em;
}
.noposts {
display: none;
text-align: center;
}
@media only screen and (max-width: 1500px) {
.post-box {
width: calc(50% - 68px);
}
}
/* mobile */
@media only screen and (max-width: 1080px) {
.post-box {
width: calc(100% - 65px);
}
.modal {
left: 0!important;
width: 100%!important;
}
}