lib.itmens/common/static/css/boofilsic_edit.css

/* Global */

:root {
    --primary: #00a1cc;
    --secondary: #606c76;
    --light: #ccc;
    --bright: rgb(250, 250, 250);
}

html {
    /* background-color: #eee; */
    font-size: 55%;
    height: 100%;
}

body {
    height: 100%;
    margin: 0;
} 

.rating-star {
    cursor: unset;
}

.rating-star .jq-star {
    cursor: unset;
}

.icon-lock svg{
    fill: var(--light);
    height: 12px;
    position: relative;
    top: 1px;
    margin-left: 3px;
}

.errorlist {
    color: var(--primary);
    font-size: small;
    font-weight: bold;
    list-style-type: square;
}

#page-wrapper {
    position: relative;
    min-height: 100vh;
    z-index: 0;
}

#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;
}

textarea {
    resize: vertical;
    height: 180px;
}

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;
}

div.dividing-line {
    height: 0;
    width: 100%;
    margin: 40px 0 15px 0;
    border-top: solid 1px var(--light);
}

/* 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 {
    
    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);
}

textarea::placeholder {
    color: var(--light);
}

/* 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;
}

.item-card img.item-image {
    height: 150px;
    display: inline-block;
}

.item-card .item-info {
    display: inline-block;
    margin-left: 20px;
}

.item-card .item-info .item-title {
    font-weight: bold;
}

.item-card .item-info .rating-star {
    display: inline;
    position: relative;
    top: 3px;
    left: -2px;
}

.prompt {
    font-weight: bold;
    margin-bottom: 40px;
}

.review .option .selection ul {
    list-style-type: none;
    display: inline;
}

.review .option .selection ul li, .review .option .selection ul label {
    display: inline;
}

.review .option .selection ul li {
    position: relative;
    top: 1px;
}

.review .option input[type="checkbox"], .review .option input[type="radio"] {
    position: relative;
    top: 2px;
}

.review input[type="submit"] {
    margin-top: 16px;
}

.review textarea {
    height: 400px;
    margin: 0;
}

.review .preview-button {
    font-size: small;
    font-weight: bold;
    color: var(--primary);
    cursor: pointer;
}

.review .markdownx-preview {
    display: none;
    min-height: 400px;
    overflow: auto;
    border-top: 0.1rem solid #d1d1d1;
    border-bottom: 0.1rem solid #d1d1d1;
    padding: 10px;
    margin: 20px 0;
}

.review .fyi {
    margin-bottom: 15px;
    color: var(--light);
}

.review {
    margin-top: 30px;
}

.review .delete-preview .markdownx-preview {
    padding-left: 0;
    padding-right: 0;
    margin: 20px 0;
}