1295 lines
23 KiB
CSS
1295 lines
23 KiB
CSS
:root {
|
|
--primary-text: #050505;
|
|
--secondary-text: #65676b;
|
|
|
|
--primary-background: #fff;
|
|
--secondary-background: #e4e6eb;
|
|
--secondary-background-hover: #d9dbdf;
|
|
|
|
--primary-border: #ced0d4;
|
|
|
|
--modal-background: rgba(244, 244, 244, 0.8);
|
|
|
|
--button-primary-color: #fff;
|
|
--button-primary-background: #1877f2;
|
|
--button-primary-background-hover: #1771e6;
|
|
--button-primary-background-active: #719ff2;
|
|
|
|
--web-wash: #f0f2f5;
|
|
--blue-link: #216fdb;
|
|
|
|
--img-desc: #fff;
|
|
--thumb-background: #000;
|
|
|
|
--error-color: #fff;
|
|
--error-background: #a94442;
|
|
--datepicker-inactive-month: #57595d;
|
|
|
|
--filter: none;
|
|
--filter-hover: invert(0.25);
|
|
--overlay-background: rgba(0, 0, 0, .25);
|
|
--overlay-fallback-background: #ccc;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
:root {
|
|
--primary-text: #e4e6eb;
|
|
--secondary-text: #b0b3b8;
|
|
|
|
--primary-background: #242526;
|
|
--secondary-background: #3a3b3c;
|
|
--secondary-background-hover: #4e4f50;
|
|
|
|
--primary-border: #393a3b;
|
|
|
|
--modal-background: rgba(11, 11, 11, 0.8);
|
|
|
|
--button-primary-color: var(--primary-text);
|
|
--button-primary-background: #2d88ff;
|
|
--button-primary-background-hover: #4294ff;
|
|
--button-primary-background-active: #77a7ff;
|
|
|
|
--web-wash: #18191a;
|
|
--blue-link: #4599ff;
|
|
|
|
--img-desc: #fff;
|
|
--thumb-background: #000;
|
|
|
|
--error-color: #fff;
|
|
--error-background: #a94442;
|
|
--datepicker-inactive-month: #57595d;
|
|
|
|
--filter: invert(0.62) sepia(0.98) saturate(0.12) hue-rotate(175deg) brightness(0.9) contrast(0.96);
|
|
--filter-hover: invert(1);
|
|
--overlay-background: rgba(255, 255, 255, .25);
|
|
--overlay-fallback-background: #555;
|
|
}
|
|
}
|
|
|
|
body {
|
|
font-family: "Open Sans", Tahoma, sans-serif;
|
|
color: var(--primary-text);
|
|
background-color: var(--web-wash);
|
|
}
|
|
|
|
.bluebar {
|
|
background-color: var(--primary-background);
|
|
border-bottom: 1px solid var(--primary-border);
|
|
color: var(--primary-text);
|
|
height: 42px;
|
|
line-height: 42px;
|
|
position: relative;
|
|
text-align: center;
|
|
}
|
|
|
|
.bluebar h1 {
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: 24px;
|
|
font-weight: 300;
|
|
}
|
|
|
|
.cover > img {
|
|
max-width: 100%;
|
|
max-height: 100%;
|
|
}
|
|
|
|
.headbar {
|
|
max-width: 850px;
|
|
margin: 0 auto;
|
|
border: 1px solid var(--primary-border);
|
|
border-top: none;
|
|
}
|
|
|
|
.cover {
|
|
font-size: 0;
|
|
position: relative;
|
|
/*min-height: 315px;*/
|
|
}
|
|
.cover .overlay {
|
|
background: url(../images/UgNUNkKQar6.png) bottom left repeat-x;
|
|
bottom: 0;
|
|
left: 0;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.cover .profile {
|
|
font-size: 0;
|
|
position: absolute;
|
|
left: 50%;
|
|
bottom: -25px;
|
|
width: 160px;
|
|
height: 160px;
|
|
margin-left: -80px;
|
|
border-radius: 50%;
|
|
display: block;
|
|
text-align: center;
|
|
padding: 5px;
|
|
background-color: var(--primary-background);
|
|
}
|
|
|
|
.cover .profile img {
|
|
border-radius: 50%;
|
|
max-width: 100%;
|
|
max-height: 100%;
|
|
}
|
|
|
|
.cover .name {
|
|
bottom: -42px;
|
|
left: 15px;
|
|
position: absolute;
|
|
color: var(--primary-text);
|
|
font-weight: bold;
|
|
font-size: 24px;
|
|
line-height: 30px;
|
|
}
|
|
|
|
@media only screen and (max-width: 502px) {
|
|
.cover .profile {
|
|
width: 80px;
|
|
height: 80px;
|
|
margin-left: -40px;
|
|
}
|
|
|
|
.cover .name {
|
|
font-size: 18px;
|
|
line-height: 26px;
|
|
}
|
|
}
|
|
|
|
#headline {
|
|
min-height: 21px;
|
|
padding: 10px;
|
|
text-align: right;
|
|
background-color: var(--primary-background);
|
|
}
|
|
|
|
#b_feed {
|
|
margin: 0 auto;
|
|
max-width: 502px;
|
|
padding: 20px 0;
|
|
}
|
|
|
|
#eof_feed {
|
|
text-align: center;
|
|
margin-bottom: 20px;
|
|
color: var(--secondary-text);
|
|
font-size: 12px;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
#eof_feed .link {
|
|
color: var(--secondary-text);
|
|
}
|
|
|
|
.show_more {
|
|
height: 40px;
|
|
line-height: 40px;
|
|
position: relative;
|
|
margin-top: -40px;
|
|
display: block;
|
|
text-align: center;
|
|
background: -moz-linear-gradient(top, transparent 0%, var(--primary-background) 75%, var(--primary-background) 100%);
|
|
background: -webkit-linear-gradient(top, transparent 0%,var(--primary-background) 75%,var(--primary-background) 100%);
|
|
background: linear-gradient(to bottom, transparent 0%,var(--primary-background) 75%,var(--primary-background) 100%);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.b_post {
|
|
border-radius: 8px;
|
|
background-color: var(--primary-background);
|
|
margin-bottom: 10px;
|
|
padding: 12px;
|
|
position: relative;
|
|
}
|
|
|
|
.b_overlay {
|
|
display: none;
|
|
align-items: center;
|
|
justify-content: center;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 8px;
|
|
z-index: 1;
|
|
background: var(--overlay-fallback-background);
|
|
}
|
|
|
|
@supports (backdrop-filter: blur(25px)) {
|
|
.b_overlay {
|
|
backdrop-filter: blur(25px);
|
|
background: var(--overlay-background);
|
|
}
|
|
}
|
|
|
|
.b_overlay .button {
|
|
background: var(--primary-background);
|
|
}
|
|
|
|
.b_post.is_hidden .b_overlay {
|
|
display: flex;
|
|
}
|
|
|
|
.b_post.new_post {
|
|
padding: 0;
|
|
}
|
|
|
|
.b_header {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.b_profile {
|
|
float: left;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.b_desc {
|
|
font-size: 14px;
|
|
margin-right: 32px;
|
|
margin-left: 50px;
|
|
}
|
|
|
|
.b_name {
|
|
color: var(--primary-text);
|
|
font-weight: bold;
|
|
margin: 3px 0;
|
|
}
|
|
|
|
.b_options,
|
|
.b_with,
|
|
.b_here {
|
|
color: var(--secondary-text);
|
|
}
|
|
|
|
.b_location {
|
|
background: url(../images/theme02/mHY-L01FIF0.png) left center no-repeat;
|
|
background-size: 15px;
|
|
padding-left: 15px;
|
|
}
|
|
|
|
.b_persons,
|
|
.b_location {
|
|
color: var(--primary-text);
|
|
}
|
|
|
|
.b_location:hover {
|
|
cursor: pointer;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.b_sharer {
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
.b_date {
|
|
color: var(--secondary-text);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.b_date:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.b_tools {
|
|
display: none;
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 8px;
|
|
height: 20px;
|
|
width: 20px;
|
|
padding: 8px;
|
|
border-radius: 50%;
|
|
transition-property: background-color;
|
|
transition-duration: 100ms;
|
|
transition-timing-function: cubic-bezier(0, 0, 1, 1);
|
|
}
|
|
|
|
.b_tools:after {
|
|
display: inline-block;
|
|
content: " ";
|
|
background: url(../images/theme02/BOCzaD2rwOa.png) center center no-repeat;
|
|
/*=retina: theme02/IBOXrWGhcIu.png*/
|
|
filter: var(--filter);
|
|
height: 20px;
|
|
width: 20px;
|
|
}
|
|
|
|
.b_tools:hover,
|
|
.b_tools:active,
|
|
.b_tools:focus {
|
|
cursor: pointer;
|
|
background-color: var(--secondary-background);
|
|
}
|
|
|
|
.b_dropdown {
|
|
display: none;
|
|
text-align: left;
|
|
background-color: var(--primary-background);
|
|
border: 1px solid var(--primary-border);
|
|
border-radius: 8px;
|
|
box-shadow:
|
|
rgba(0,0,0,.2) 0px 12px 28px 0px,
|
|
rgba(0,0,0,.1) 0px 2px 4px 0px,
|
|
rgba(255,255,255,.05) 0px 0px 0px 1px inset;
|
|
z-index: 105;
|
|
margin: 0;
|
|
position: absolute;
|
|
padding: 8px;
|
|
}
|
|
|
|
.b_dropdown li {
|
|
list-style-type: none;
|
|
}
|
|
|
|
.b_dropdown li a {
|
|
display: block;
|
|
color: var(--primary-text);
|
|
font-size: 15px;
|
|
font-weight: normal;
|
|
line-height: 20px;
|
|
padding: 8px 16px;
|
|
border-radius: 4px;
|
|
transition-property: background-color;
|
|
transition-duration: 100ms;
|
|
transition-timing-function: cubic-bezier(0, 0, 1, 1);
|
|
}
|
|
|
|
.b_dropdown li a:hover,
|
|
.b_dropdown li a:active,
|
|
.b_dropdown li a:focus {
|
|
cursor: pointer;
|
|
background-color: var(--secondary-background);
|
|
}
|
|
|
|
.b_text {
|
|
word-wrap: break-word;
|
|
font-size: 14px;
|
|
padding-top: 10px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.b_text a,
|
|
.b_text .tag {
|
|
color: var(--blue-link);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.b_text a:hover,
|
|
.b_text a:active,
|
|
.b_text a:focus {
|
|
cursor: pointer;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.b_content {
|
|
margin: 10px -12px 0;
|
|
}
|
|
|
|
.b_link {
|
|
display: block;
|
|
color: var(--primary-text);
|
|
text-decoration: none;
|
|
margin-top: 10px;
|
|
overflow: hidden;
|
|
background: var(--secondary-background);
|
|
}
|
|
|
|
.b_link .thumb {
|
|
width: 100%;
|
|
height: 260px;
|
|
position: relative;
|
|
background: var(--thumb-background);
|
|
text-align: center;
|
|
}
|
|
|
|
.b_link .thumb img {
|
|
max-width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.b_link .thumb .play {
|
|
background: url(../images/bNvHN6v1NeH.png) no-repeat;
|
|
height: 54px;
|
|
width: 54px;
|
|
bottom: 0;
|
|
left: 0;
|
|
margin: auto;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
}
|
|
|
|
.b_link .thumb:hover .play {
|
|
background-position: 0 -55px;
|
|
}
|
|
|
|
.b_link .info {
|
|
position: relative;
|
|
padding: 16px;
|
|
margin-top: 16px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.b_link .info .title {
|
|
font-family: Georgia, serif;
|
|
font-size: 18px;
|
|
font-weight: 500;
|
|
line-height: 22px;
|
|
}
|
|
|
|
.b_link .info .desc {
|
|
margin-top: 5px;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.b_link .info .host {
|
|
top: 0px;
|
|
left: 16px;
|
|
position: absolute;
|
|
right: 12px;
|
|
color: var(--secondary-text);
|
|
font-size: 11px;
|
|
line-height: 11px;
|
|
text-transform: uppercase;
|
|
background: var(--secondary-background);
|
|
}
|
|
|
|
.b_imglink {
|
|
display: block;
|
|
text-decoration: none;
|
|
margin-top: 10px;
|
|
box-shadow: 0 1px 3px rgba(0,0,0,.41);
|
|
overflow: hidden;
|
|
position: relative;
|
|
font-size: 0;
|
|
text-align: center;
|
|
min-height: 150px;
|
|
}
|
|
|
|
.b_imglink img {
|
|
max-width: 100%;
|
|
max-height: 470px;
|
|
}
|
|
|
|
.b_imglink .ftr {
|
|
background: url(../images/QijIVO3ZIrO.png) repeat-x 0 0;
|
|
bottom: 0;
|
|
color: var(--img-desc);
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
height: 56px;
|
|
left: 0;
|
|
position: absolute;
|
|
right: 0;
|
|
text-align: left;
|
|
text-shadow: 0 1px 4px var(--modal-background);
|
|
text-transform: uppercase;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.b_imglink .ftr .host {
|
|
bottom: 10px;
|
|
left: 12px;
|
|
position: absolute;
|
|
right: 12px;
|
|
font-size: 11px;
|
|
line-height: 11px;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.b_imglink .ftr .desc {
|
|
bottom: 25px;
|
|
font-size: 14px;
|
|
left: 11px;
|
|
overflow: hidden;
|
|
position: absolute;
|
|
right: 44px;
|
|
text-overflow: ellipsis;
|
|
text-transform: none;
|
|
}
|
|
|
|
.b_imglink .ftr i.exit {
|
|
background: url(../images/JNPO3NqYHEj.png) no-repeat;
|
|
background-position: 0 -158px;
|
|
width: 24px;
|
|
height: 24px;
|
|
display: inline-block;
|
|
position: absolute;
|
|
bottom: 9px;
|
|
right: 10px;
|
|
}
|
|
|
|
.b_img {
|
|
display: block;
|
|
margin-top: 10px;
|
|
overflow: hidden;
|
|
position: relative;
|
|
font-size: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.b_img img {
|
|
max-width: 100%;
|
|
max-height: 470px;
|
|
}
|
|
|
|
.b_goal {
|
|
text-align: center;
|
|
font-size: 1.5em;
|
|
margin: 5px 0;
|
|
}
|
|
|
|
.b_goal:before {
|
|
content: " ";
|
|
display: block;
|
|
width: 40px;
|
|
height: 40px;
|
|
background: no-repeat center center;
|
|
background-color: var(--button-primary-background);
|
|
border-radius: 50%;
|
|
line-height: 0;
|
|
margin: 10px auto;
|
|
}
|
|
|
|
.b_goal.star:before {
|
|
background-image: url(../images/star.png);
|
|
}
|
|
|
|
.b_goal.trophy:before {
|
|
background-image: url(../images/trophy.png);
|
|
}
|
|
|
|
.b_textarea {
|
|
width: 100%;
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
height: 200px;
|
|
min-height: 200px;
|
|
border: 0;
|
|
}
|
|
|
|
.mask {
|
|
display: none;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 100;
|
|
}
|
|
|
|
.modal {
|
|
overflow: auto;
|
|
position: fixed;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
z-index: 95;
|
|
outline: 0;
|
|
background-color: var(--modal-background);
|
|
}
|
|
|
|
.modal-dialog {
|
|
max-width: 600px;
|
|
margin: 30px auto;
|
|
position: relative;
|
|
width: auto;
|
|
/*margin: 10px;*/
|
|
}
|
|
|
|
.modal-dialog.small {
|
|
max-width: 400px;
|
|
}
|
|
|
|
.modal-content {
|
|
position: relative;
|
|
background-color: var(--primary-background);
|
|
border: 1px solid var(--primary-border);
|
|
border-radius: 8px;
|
|
box-shadow:
|
|
rgba(0,0,0,.2) 0px 12px 28px 0px,
|
|
rgba(0,0,0,.1) 0px 2px 4px 0px,
|
|
rgba(255,255,255,.05) 0px 0px 0px 1px inset;
|
|
outline: 0;
|
|
}
|
|
|
|
.modal-header {
|
|
border-bottom: 1px solid var(--primary-border);
|
|
color: var(--primary-text);
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-size: 20px;
|
|
line-height: 19px;
|
|
padding: 18px 12px;
|
|
}
|
|
|
|
.modal-header:before,
|
|
.modal-header:after {
|
|
content: " ";
|
|
display: table;
|
|
}
|
|
|
|
.modal-header:after {
|
|
clear: both;
|
|
}
|
|
|
|
.modal-header .close {
|
|
position: absolute;
|
|
top: 15px;
|
|
right: 15px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.modal-header .close,
|
|
.content .clear {
|
|
padding: 8px;
|
|
border-radius: 50%;
|
|
background-color: var(--secondary-background);
|
|
box-sizing: content-box;
|
|
border: 0;
|
|
height: 20px;
|
|
width: 20px;
|
|
transition-property: background-color;
|
|
transition-duration: 100ms;
|
|
transition-timing-function: cubic-bezier(0, 0, 1, 1);
|
|
}
|
|
|
|
.modal-header .close:after,
|
|
.content .clear:after {
|
|
display: inline-block;
|
|
content: " ";
|
|
background: url(../images/theme02/HxCo9uaZIcB.png) no-repeat;
|
|
/*=retina: theme02/YFO-fzIJZ2K.png*/
|
|
background-position: 0px -21px;
|
|
filter: var(--filter);
|
|
height: 20px;
|
|
width: 20px;
|
|
}
|
|
.modal-header .close:hover,
|
|
.content .clear:hover,
|
|
.modal-header .close:active,
|
|
.content .clear:active,
|
|
.modal-header .close:focus,
|
|
.content .clear:focus {
|
|
background-color: var(--secondary-background-hover);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.modal-title {
|
|
margin: 0;
|
|
line-height: 1.42857;
|
|
}
|
|
|
|
.modal-body {
|
|
position: relative;
|
|
padding: 15px;
|
|
}
|
|
|
|
.modal-body.content {
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
|
|
.modal-footer {
|
|
min-height: 40px;
|
|
text-align: right;
|
|
border-top: 1px solid var(--primary-border);
|
|
}
|
|
|
|
.modal-footer .buttons {
|
|
margin: 8px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.modal-footer .buttons .button {
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.modal-footer .buttons .button:last-child {
|
|
margin-right: 0;
|
|
}
|
|
|
|
.modal-footer:before,
|
|
.modal-footer:after {
|
|
content: " ";
|
|
display: table;
|
|
}
|
|
|
|
.modal-footer:after {
|
|
clear: both;
|
|
}
|
|
|
|
.button {
|
|
display: inline-block;
|
|
border: 0;
|
|
border-radius: 6px;
|
|
box-sizing: content-box;
|
|
font-size: 15px;
|
|
line-height: 19px;
|
|
padding: 8px 12px;
|
|
position: relative;
|
|
text-align: center;
|
|
text-shadow: none;
|
|
vertical-align: middle;
|
|
cursor: pointer;
|
|
color: var(--primary-text);
|
|
border: 1px solid var(--primary-border);
|
|
text-decoration: none;
|
|
transition-property: background-color;
|
|
transition-duration: 100ms;
|
|
transition-timing-function: cubic-bezier(0, 0, 1, 1);
|
|
}
|
|
.button:focus,
|
|
.button:active {
|
|
transform: scale(.98);
|
|
}
|
|
|
|
.button.gray {
|
|
border: 0;
|
|
background-color: var(--secondary-background);
|
|
}
|
|
.button.gray:hover,
|
|
.button.gray:focus,
|
|
.button.gray:active {
|
|
background-color: var(--secondary-background-hover);
|
|
}
|
|
|
|
.button.blue {
|
|
border: 0;
|
|
color: var(--button-primary-color);
|
|
background-color: var(--button-primary-background);
|
|
}
|
|
.button.blue:hover {
|
|
background-color: var(--button-primary-background-hover);
|
|
}
|
|
.button.blue:focus,
|
|
.button.blue:active {
|
|
background-color: var(--button-primary-background-active);
|
|
}
|
|
|
|
.login-form input {
|
|
color: var(--primary-text);
|
|
border-radius: 50px;
|
|
background-color: var(--secondary-background);
|
|
|
|
height: 44px;
|
|
font-size: 16px;
|
|
width: 100%;
|
|
margin-bottom: 10px;
|
|
border: 0;
|
|
padding: 0 8px;
|
|
box-sizing: border-box;
|
|
outline: none;
|
|
text-indent: 5px;
|
|
}
|
|
|
|
.login-form input:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.login-form input:hover {
|
|
box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
|
|
}
|
|
|
|
.e_profile {
|
|
border-radius: 50%;
|
|
float: left;
|
|
}
|
|
|
|
.e_drag, .e_drop {
|
|
display: none;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: var(--secondary-background-hover);
|
|
border: 2px dashed var(--secondary-background);
|
|
border-radius: 3px;
|
|
color: var(--secondary-text);
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
box-sizing: border-box;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.e_drag span, .e_drop span {
|
|
margin: auto;
|
|
}
|
|
|
|
.e_drop {
|
|
border-color: var(--button-primary-background);
|
|
color: var(--button-primary-background);
|
|
}
|
|
|
|
.e_loading {
|
|
display: none;
|
|
text-align: center;
|
|
}
|
|
|
|
.e_dots {
|
|
width:8px;
|
|
height:8px;
|
|
|
|
animation-name: e_dots;
|
|
animation-duration: 2s;
|
|
animation-iteration-count: infinite;
|
|
animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
|
|
|
|
background-color: var(--primary-text);
|
|
border-radius: 4px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.e_dots:nth-child(2) {
|
|
animation-delay:0.3s;
|
|
}
|
|
|
|
.e_dots:nth-child(3) {
|
|
animation-delay:0.6s;
|
|
}
|
|
|
|
@keyframes e_dots {
|
|
0% {
|
|
opacity: .265;
|
|
transform: scale(.8,.8)
|
|
}
|
|
|
|
5% {
|
|
opacity: .25
|
|
}
|
|
|
|
50% {
|
|
transform: scale(1,1)
|
|
}
|
|
|
|
55% {
|
|
opacity: 1
|
|
}
|
|
|
|
100% {
|
|
opacity: .265;
|
|
transform: scale(.8,.8)
|
|
}
|
|
}
|
|
|
|
.e_loading .e_meter {
|
|
height: 5px;
|
|
position: relative;
|
|
margin-top: 15px;
|
|
box-shadow: inset 0 -1px 1px rgba(255,255,255,.3);
|
|
}
|
|
|
|
.e_loading .e_meter > span {
|
|
display: block;
|
|
width: 0;
|
|
height: 100%;
|
|
background-color: var(--button-primary-background);
|
|
box-shadow:
|
|
inset 0 2px 9px rgba(255,255,255,.3),
|
|
inset 0 -2px 6px rgba(0,0,0,.4);
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.e_text {
|
|
margin-left: 50px;
|
|
outline: 0;
|
|
white-space: pre-line;
|
|
min-height: 50px;
|
|
}
|
|
|
|
.t_area {
|
|
overflow: hidden;
|
|
padding: 0 16px 0 0;
|
|
margin: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.t_area .e_text {
|
|
white-space: pre-wrap;
|
|
margin: 0 0 0 10px;
|
|
min-height: 88px;
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
background: transparent;
|
|
border: 0;
|
|
}
|
|
|
|
.options {
|
|
text-align: left;
|
|
float: left;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: 0;
|
|
}
|
|
|
|
.options li {
|
|
list-style-type: none;
|
|
display: inline-block;
|
|
margin: 5px;
|
|
}
|
|
|
|
.options li a {
|
|
padding: 10px;
|
|
display: inline-block;
|
|
cursor: pointer;
|
|
|
|
border-radius: 50%;
|
|
height: 20px;
|
|
width: 20px;
|
|
transition-property: background-color;
|
|
transition-duration: 100ms;
|
|
transition-timing-function: cubic-bezier(0, 0, 1, 1);
|
|
}
|
|
|
|
.options li.kepet a {
|
|
position: relative;
|
|
}
|
|
|
|
.options li.kepet a span {
|
|
height: 100%;
|
|
overflow: hidden;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.options li.kepet a span .photo_upload {
|
|
bottom: 0;
|
|
cursor: inherit;
|
|
font-size: 1000px !important;
|
|
height: 300px;
|
|
margin: 0;
|
|
opacity: 0;
|
|
padding: 0;
|
|
position: absolute;
|
|
right: 0;
|
|
}
|
|
|
|
.options li.kepet a {
|
|
background: url(../images/theme02/Xe-tUjaQ4vo.png) center center no-repeat;
|
|
/*=retina: theme02/BvwOjzIAV9T.png*/
|
|
}
|
|
|
|
.options li.feeling a {
|
|
background: url(../images/theme02/kOtcUC5Tvlq.png) center center no-repeat;
|
|
/*=retina: theme02/xGM66u5seRO.png*/
|
|
}
|
|
|
|
.options li.persons a {
|
|
background: url(../images/theme02/7_Yye-V3r9M.png) center center no-repeat;
|
|
/*=retina: theme02/38mmIT7r0jG.png*/
|
|
}
|
|
|
|
.options li.location a {
|
|
background: url(../images/theme02/mHY-L01FIF0.png) center center no-repeat;
|
|
/*=retina: theme02/W5IvJHzSLg7.png*/
|
|
}
|
|
|
|
.options li a:hover,
|
|
.options li a:active,
|
|
.options li a.active,
|
|
.options li a:focus {
|
|
background-color: var(--secondary-background);
|
|
}
|
|
|
|
.options_content {
|
|
width: 100%;
|
|
margin-bottom: -1px;
|
|
}
|
|
|
|
.options_content tr {
|
|
display: none;
|
|
}
|
|
|
|
.options_content th {
|
|
width: 1%;
|
|
white-space: nowrap;
|
|
font-size: 13px;
|
|
font-weight: normal;
|
|
text-align: left;
|
|
padding: 8px 6px;
|
|
background-color: var(--primary-border);
|
|
border: 1px solid var(--primary-border);
|
|
}
|
|
|
|
.options_content td {
|
|
padding: 8px 6px;
|
|
border: 1px solid var(--primary-border);
|
|
position: relative;
|
|
}
|
|
|
|
.options_content td input {
|
|
font-size: 13px;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
border: 0;
|
|
padding: 0;
|
|
margin: 0;
|
|
outline: 0;
|
|
background: transparent;
|
|
}
|
|
|
|
.options_content td .clear {
|
|
position: absolute;
|
|
top: 11px;
|
|
right: 11px;
|
|
}
|
|
|
|
.options_content td .clear,
|
|
.error .clear {
|
|
background: url(../images/theme02/LiJKvoYFmUK.png) no-repeat;
|
|
/*=retina: theme02/gc6VwTsu2qZ.png*/
|
|
display: inline-block;
|
|
width: 16px;
|
|
height: 16px;
|
|
border: 0;
|
|
padding: 0;
|
|
outline: 0;
|
|
margin: 0;
|
|
border-radius: 50%;
|
|
transition-property: background-color;
|
|
transition-duration: 100ms;
|
|
transition-timing-function: cubic-bezier(0, 0, 1, 1);
|
|
}
|
|
|
|
.options_content td .clear:hover,
|
|
.options_content td .clear:active,
|
|
.options_content td .clear:focus {
|
|
background-color: var(--secondary-background);
|
|
}
|
|
|
|
.content {
|
|
display: none;
|
|
padding-top: 0;
|
|
}
|
|
|
|
.content .clear {
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 20px;
|
|
z-index: 105;
|
|
}
|
|
|
|
.privacy {
|
|
cursor: pointer;
|
|
padding: 8px 12px;
|
|
}
|
|
|
|
i.private,
|
|
i.friends,
|
|
i.public {
|
|
filter: var(--filter);
|
|
display: inline-block;
|
|
height: 16px;
|
|
width: 16px;
|
|
vertical-align: middle;
|
|
bottom: 1px;
|
|
position: relative;
|
|
}
|
|
|
|
i.private {
|
|
background: url(../images/theme02/jcKElmriUSj.png) no-repeat;
|
|
/*=retina: theme02/2CGkY1_Ax_-.png*/
|
|
}
|
|
|
|
i.friends {
|
|
background: url(../images/theme02/amepTQ7nV0z.png) no-repeat;
|
|
/*=retina: theme02/qZPl7lx7zY1.png*/
|
|
}
|
|
|
|
i.public {
|
|
background: url(../images/theme02/7wYk0RRj5-g.png) no-repeat;
|
|
/*=retina: theme02/THYN1-y3aPS.png*/
|
|
}
|
|
|
|
.privacy_icon {
|
|
margin-right: 1px;
|
|
}
|
|
|
|
.privacy_settings a > i,
|
|
.button .cnt > i {
|
|
margin-right: 8px;
|
|
}
|
|
.privacy_settings a:hover > i{
|
|
filter: var(--filter-hover);
|
|
}
|
|
|
|
.error {
|
|
color: var(--error-color);
|
|
background-color: var(--error-background);
|
|
padding: 15px;
|
|
margin-bottom: 20px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.error .clear {
|
|
float: right;
|
|
margin-top: 5px;
|
|
margin-left: 15px;
|
|
}
|
|
|
|
body > .error {
|
|
position: fixed;
|
|
left: 10px;
|
|
bottom: 10px;
|
|
max-width: 300px;
|
|
}
|
|
|
|
.more_posts {
|
|
display: none;
|
|
text-align: center;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.tag {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.tag:hover,
|
|
.tag:active {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
code {
|
|
overflow: auto;
|
|
white-space: pre;
|
|
margin: 5px 0;
|
|
}
|
|
|
|
/* datepicker */
|
|
.datepicker {
|
|
text-align: center;
|
|
}
|
|
.datepicker table {
|
|
width: 100%;
|
|
margin: 5px 0;
|
|
}
|
|
|
|
.datepicker th,
|
|
.datepicker td {
|
|
width: 12.5%;
|
|
}
|
|
|
|
.datepicker th {
|
|
padding: 5px 0;
|
|
}
|
|
.datepicker td {
|
|
color: var(--datepicker-inactive-month);
|
|
padding: 5px;
|
|
transition-property: background-color;
|
|
transition-duration: 100ms;
|
|
transition-timing-function: cubic-bezier(0, 0, 1, 1);
|
|
}
|
|
.datepicker td.active {
|
|
color: var(--primary-text);
|
|
}
|
|
|
|
.datepicker td.today {
|
|
position: relative;
|
|
}
|
|
|
|
.datepicker td.today:after {
|
|
width: 50%;
|
|
height: 2px;
|
|
bottom: 0;
|
|
left: 25%;
|
|
position: absolute;
|
|
display: inline-block;
|
|
content: ' ';
|
|
background-color: red;
|
|
}
|
|
|
|
.datepicker td:hover {
|
|
background-color: var(--secondary-background);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.datepicker td.selected {
|
|
color: var(--button-primary-color);
|
|
background-color: var(--button-primary-background);
|
|
}
|
|
|
|
select {
|
|
color: var(--primary-text);
|
|
border-radius: 50px;
|
|
background-color: var(--secondary-background);
|
|
padding: 8px;
|
|
border: 0;
|
|
outline: none;
|
|
}
|
|
|
|
/* For retina displays */
|
|
@media only screen and (min--moz-device-pixel-ratio: 2),
|
|
only screen and (-o-min-device-pixel-ratio: 2/1),
|
|
only screen and (-webkit-min-device-pixel-ratio: 2),
|
|
only screen and (min-device-pixel-ratio: 2)
|
|
{
|
|
.b_tools:after {
|
|
background-image: url(../images/theme02/IBOXrWGhcIu.png);
|
|
background-size: 20px 20px;
|
|
/*original: theme02/BOCzaD2rwOa.png*/
|
|
}
|
|
.options li.kepet a {
|
|
background-image: url(../images/theme02/BvwOjzIAV9T.png);
|
|
background-size: 20px 20px;
|
|
/*original: theme02/Xe-tUjaQ4vo.png*/
|
|
}
|
|
.options li.feeling a {
|
|
background-image: url(../images/theme02/xGM66u5seRO.png);
|
|
background-size: 20px 20px;
|
|
/*original: theme02/kOtcUC5Tvlq.png*/
|
|
}
|
|
.options li.persons a {
|
|
background-image: url(../images/theme02/38mmIT7r0jG.png);
|
|
background-size: 20px 20px;
|
|
/*original: theme02/7_Yye-V3r9M.png*/
|
|
}
|
|
.b_location {
|
|
background-image: url(../images/theme02/W5IvJHzSLg7.png);
|
|
background-size: 15px 15px;
|
|
/*original: theme02/mHY-L01FIF0.png*/
|
|
}
|
|
.options li.location a {
|
|
background-image: url(../images/theme02/W5IvJHzSLg7.png);
|
|
background-size: 20px 20px;
|
|
/*original: theme02/mHY-L01FIF0.png*/
|
|
}
|
|
.modal-header .close:after,
|
|
.content .clear:after {
|
|
background-image: url(../images/theme02/YFO-fzIJZ2K.png);
|
|
background-size: 21px 42px;
|
|
/*=original: theme02/HxCo9uaZIcB.png*/
|
|
}
|
|
.options_content td .clear {
|
|
background-image: url(../images/theme02/gc6VwTsu2qZ.png);
|
|
background-size: 16px 16px;
|
|
/*original: theme02/LiJKvoYFmUK.png*/
|
|
}
|
|
i.private {
|
|
background-image: url(../images/theme02/2CGkY1_Ax_-.png);
|
|
background-size: 16px 16px;
|
|
/*original: theme02/jcKElmriUSj.png*/
|
|
}
|
|
i.friends {
|
|
background-image: url(../images/theme02/qZPl7lx7zY1.png);
|
|
background-size: 16px 16px;
|
|
/*original: theme02/amepTQ7nV0z.png*/
|
|
}
|
|
i.public {
|
|
background-image: url(../images/theme02/THYN1-y3aPS.png);
|
|
background-size: 16px 16px;
|
|
/*original: theme02/7wYk0RRj5-g.png*/
|
|
}
|
|
}
|