Beautiful and Nice PCMS

pcms.user.css

/* 
  Beautiful and Nice PCMS
  Written by tg@trall 
*/

/* General */
html {overflow-y: auto;}

body {
    font-size: 14px;
    line-height: 1.5;
    position: relative; /* for .locale */
    max-width: 920px;
    margin: 0 auto;
    padding: 0 20px;
}

body, table.standings, .menu a, h1, h2, h3, h4 {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    color: #24292e;
    font-variant: normal;
}

img.head, hr {display: none;}

.mainDivContent, .mainDivInner, .mainDivOuter, .mainDiv, .containerDiv, .headDiv, .menuDiv {
    position: initial!important;
    display: block!important;
    height: auto!important;
}

div.mainDivContent {
    padding: 0;
}

#running-clock, div.standings p:nth-child(2) {text-transform: lowercase;}

#running-clock:first-letter, div.standings p:nth-child(2):first-letter {text-transform: uppercase;}

.mainDiv a {
    color: #0366d6;
    text-decoration: none;
}

.mainDiv a:hover {
    color: #0366d6;
    background: transparent!important;
    text-decoration: underline;
}

/* Menu */
.menu {
    width: 100%;
    display: inline-flex!important;
    background: transparent;
    border: 0;
    margin-left: -10px;
    margin-bottom: 20px;
}

.containerDiv:before {
    content: 'PCMS2 Client';
    display: block;
    font-weight: 800;
    font-size: 47px;
    margin-top: 30px;
}

.locale {display: none;}

.menu a {
    display: block;
    order: 4;
    opacity: 0.5;
    padding: 2px 10px;
    margin-right: 5px;
    transition: all 0.2s;
}

.menu a:hover {
    opacity: 1;
    color: inherit;
    background-color: #efefef;
    border-radius: 50px;
}

.menu a[title="Отправить"], .menu a[title="Решения"], .menu a[title="Результаты"] {opacity: 1;}

.menu a[title="Отправить"] {order: 1;}

.menu a[title="Решения"] {order: 2;}

.menu a[title="Результаты"] {order: 3;}

/* Form */
.properties {margin-left: 2px!important;}

.properties td {
    display: block;
    margin-bottom: 3px;
}

.properties .key {
    text-transform: uppercase;
    font-size: 0.8em;
    letter-spacing: 0.1em;
}

.properties td:not(.key) {font-size: 1.5em;}

.properties tr {
    display: block;
    margin-bottom: 10px;
}

input[type="submit"] {
    position: relative;
    display: inline-block;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-repeat: repeat-x;
    background-position: -1px -1px;
    background-size: 110% 110%;
    border: 1px solid rgba(27,31,35,0.2);
    border-radius: 0.25em;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #24292e;
    background-color: #eff3f6;
    background-image: linear-gradient(-180deg, #fafbfc 0%, #eff3f6 90%);
}

input[type="submit"]:focus {box-shadow: 0 0 0 0.2em rgba(3,102,214,0.3)}

input[type="submit"]:hover {
    background-color: #e6ebf1;
    background-image: linear-gradient(-180deg, #f0f3f6 0%, #e6ebf1 90%);
    background-position: -.5em;
    border-color: rgba(27,31,35,0.35)
}

input[type="submit"]:active {
    background-color: #e9ecef;
    background-image: none;
    border-color: rgba(27,31,35,0.35);
    box-shadow: inset 0 0.15em 0.3em rgba(27,31,35,0.15)
}

input[type="submit"]:focus {outline: 0}

select {
    min-height: 34px;
    padding: 6px 8px;
    font-size: 16px;
    line-height: 20px;
    color: #24292e;
    vertical-align: middle;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: right 8px center;
    border: 1px solid #d1d5da;
    border-radius: 3px;
    outline: none;
    box-shadow: inset 0 1px 2px rgba(27,31,35,0.075);
    display: inline-block;
    max-width: 100%;
    height: 34px;
    padding-right: 24px;
    padding-right: 8px \9;
    background: #fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC") no-repeat right 8px center;
    background-image: none \9;
    background-size: 8px 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

input[type="text"], input[type="password"], textarea {
    padding: 6px 8px;
    font-size: 14px;
    line-height: 20px;
    color: #24292e;
    vertical-align: middle;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: right 8px center;
    border: 1px solid #d1d5da;
    border-radius: 3px;
    outline: none;
    box-shadow: inset 0 1px 2px rgba(27,31,35,0.075);
}

input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
    border-color: #2188ff;
    outline: none;
    box-shadow: inset 0 1px 2px rgba(27,31,35,0.075), 0 0 0 0.2em rgba(3,102,214,0.3);
}

#login {
    margin: 10px auto;
    width: 170px;
}

/* runs */
table.list td {
    padding: 3px 10px!important;
    border: solid 1px #00000026;
}

.action {
    border-bottom: 2px dashed #a0a0a0;
    line-height: unset;
    padding-bottom: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.runs .head h2[title="Нажмите чтобы спрятать / показать"] {cursor: pointer;}

/* colors */
/* green */
tr.OK {
    background-color: #dcffe4!important;
    color: #144620;
}
/* red */
tr.WA {
    background-color: #ffdce0!important;
    color: #86181d;
}
tr.PE {
    background-color: #fdaeb7;
    color: #86181d;
}
/* blue */
tr.TL, tr.ML, tr.IL, tr.OL {
    background-color: #e6dcfd;
    color: #3a1d6e;
}

/* standings */
table.standings {
    box-shadow: 0 1px 1px rgba(27,31,35,0.1) !important;
    margin-top: 70px;
}

div.standings {margin-top: 50px;}

table.standings thead, table.standings tbody, table.standings tfoot {
    border-left: 1px solid #d1d5da!important;
    border-right: 1px solid #d1d5da!important;
    border-top: 1px solid #d1d5da!important;
}

table.standings tfoot tr {
    border-right: 1px solid #d1d5da!important;
}

.standings .party, .standings .solved {
    font-weight: 500;
}

.standings thead th {
    font-weight: 700!important;
    text-align: center!important;
    padding: 10px;
    background: white;
}

.standings .ok {
    color: #176f2c;
    font-weight: 600;
}
.standings .ok div {font-weight: normal;}

.standings .first {background: #dcffe4;}
.standings .current {
    background-color: #d1bcf9;
    color: #3a1d6e;
}
.standings .row11 {background-color: #dbedff;}

.standings .row10 {background-color: #c8e1ff;}

.standings .row00 {background-color: #f6f8fa;}

/* code view */
.syntaxhighlighter {
    border: 0!important;
}