lib.itmens/common/static/css/boofilsic_edit.css
2020-05-01 22:46:15 +08:00

329 lines
No EOL
5.5 KiB
CSS

/* Global */
:root {
--primary: #9b4dca;
--secondary: #606c76;
--light: #ccc;
--bright: rgb(250, 250, 250);
}
html {
/* background-color: #eee; */
font-size: 55%;
height: 100%;
}
body {
height: 100%;
margin: 0;
}
#page-wrapper {
position: relative;
min-height: 100vh;
}
#content-wrapper {
padding-bottom: 160px;
}
input[type=text]::-ms-clear { display: none; width : 0; height: 0; }
input[type=text]::-ms-reveal { display: none; width : 0; height: 0; }
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }
footer {
text-align: center;
margin-bottom: 4px !important;
border-top: var(--bright) solid 2px;
position: absolute !important;
left: 50%;
transform: translateX(-50%);
bottom: 0;
}
footer a {
margin: 0 15px;
font-size: small;
}
img.emoji {
height: 20px !important;
width: 20px !important;
box-sizing: border-box;
object-fit: contain;
position: relative;
top: 3px;
}
.more-link {
font-size: small;
margin-left: 5px;
}
/* Nav Bar */
section#navbar {
background-color: var(--bright);
box-sizing: border-box;
padding: 18px 0;
margin-bottom: 50px;
border-bottom: var(--light) 0.5px solid;
}
.navbar img.logo {
width: 100px;
float: left;
}
.navbar h4.nav-title {
display: inline;
margin-left: 16px;
position: relative;
top: 7px;
}
.navbar a.nav-link, .navbar a.nav-link:visited {
font-size: 80%;
float: right;
margin-top: 10px;
color: var(--secondary);
margin-left: 20px;
}
.navbar a.nav-link:hover, .navbar a.nav-link:hover:visited {
color: var(--primary);
}
/* Main Content Section */
section#content div#main {
padding: 32px 35px;
background-color: var(--bright);
width: 100%;
}
div#main form label {
font-size: small;
font-weight: normal;
}
div#main form input::placeholder {
color: var(--light);
}
div#main form button[type="submit"] {
margin-top: 20px;
}
div#main form input[type="file"] {
display: block;
margin-bottom: 0;
}
/* Info Card */
.aside-card {
background-color: var(--bright);
padding: 20px 24px 15px 24px;
margin-bottom: 30px;
}
.aside-card .clearfix {
margin-bottom: 15px;
}
.aside-card .info-avatar {
width: 72px;
object-fit: contain;
float: left;
}
.aside-card .info-name {
margin: 0;
max-width: 120px;
margin-bottom: 12px;
padding-left: 8px;
float: left;
}
.aside-card .info-brief {
line-height: 2rem;
font-size: small;
overflow-wrap: break-word;
hyphens: auto;
}
.aside-card a.report {
color: var(--light);
font-size: small;
}
.aside-card a.follow {
font-size: small;
color: var(--secondary);
margin-right: 10px;
}
.aside-card .button.add-button {
margin-top: 10px;
}
/* Relation Card */
.relation-card {
padding: 2px;
margin-bottom: 10px;
}
.relation-card .relation-label {
margin: 0;
margin-bottom: 12px;
display: inline-block;
}
.relation-card .relation-user .relation-avatar {
width: 50px;
}
.relation-card .relation-user .relation-name {
display: block;
font-size: small;
line-height: 1.8rem;
/* white-space: nowrap; */
text-overflow: ellipsis;
/* max-width: 100px; */
overflow: hidden;
}
.relation-card .relation-user-list {
margin-bottom: 15px;
}
.relation-card .relation-user-list .relation-user {
list-style-type: none;
text-align: center;
margin-bottom: 0px !important;
justify-items: center;
padding: 0 3px !important;
}
/* Report Card */
.report-card {
padding: 2px;
font-size: small;
}
.report-card .report-label {
margin: 0;
}
.report-card .report-user-link {
padding: 0 5px;
}
.report-card .report-message {
list-style-type: none;
}
/* Search Result */
.result-item {
list-style: none;
margin-bottom: 30px;
}
.result-item .result-info {
margin-left: 20px;
float: left;
}
.result-item img.result-book-cover {
float: left;
object-fit: contain;
height: 150px;
width: 100px;
}
.result-item .result-info .rating-empty {
font-size: small;
}
.result-item .result-info .rating-star{
cursor: unset;
display: inline;
position: relative;
top: 3px;
left: -3px;
}
/* overwrite rating-star plugin */
.result-item .result-info .rating-star .jq-star {
cursor: unset;
}
.result-item .result-info .result-book-info {
font-size: 80%;
overflow: hidden;
width: 420px;
display: inline-block;
white-space: nowrap;
text-overflow: ellipsis;
position: relative;
top: .55rem;
}
.result-item .result-info .rating-score {
font-size: 80%;
display: inline;
margin-right: 20px;
}
.result-item .result-info .result-book-title {
white-space: nowrap;
text-overflow: ellipsis;
max-width: 500px;
display: block;
overflow: hidden
}
.result-item .result-info .result-book-brief {
margin-top: 10px;
margin-bottom: 0;
font-size: small;
width: 565px;
display: block;
text-overflow: ellipsis;
overflow: hidden;
/* white-space: nowrap; */
height: 90px;
}
/* Pagination */
.pagination {
margin-top: 50px;
text-align: center;
}
.pagination a {
display: inline-block;
}
.pagination .button {
padding: 0 5px;
height: 2rem;
}
.pagination .page-index {
font-size: small;
}