1509 lines
32 KiB
CSS
1509 lines
32 KiB
CSS
/*!
|
|
* City.css v2.0.0
|
|
*
|
|
* Inspired by Air (by asf), Libre (by PythonNut), and Grey (by Tungsten)
|
|
*
|
|
* https://github.com/tyxchen/aops-city | Released under the MIT License
|
|
*/
|
|
/**
|
|
* Components
|
|
*/
|
|
@import url(//brick.a.ssl.fastly.net/Raleway:200,300/Merriweather:200,200i,700,700i/Lato:400,700);
|
|
@import url("https://fonts.googleapis.com/css?family=Titillium+Web:100,200,300,375,400,500,600,700,800,900");
|
|
@import url("https://fonts.googleapis.com/css?family=VT323:100,200,300,375,400,500,600,700,800,900");
|
|
/**
|
|
* Groups
|
|
*/
|
|
/* Reset background, padding, border & margin */
|
|
#main, #navigation_box, #header h1, .cmty-hide-content, .bbcode_quote,
|
|
.bbcode_quote_head,
|
|
.bbcode_quote_body, fieldset {
|
|
/* Source for %reset-all */
|
|
background: none;
|
|
padding: 0;
|
|
border: none;
|
|
margin: 0;
|
|
}
|
|
|
|
/* Set box-sizing to border-box */
|
|
input[type='text'],
|
|
textarea, .cmty-poll-question,
|
|
.cmty-poll-inputs, #wrapper, #main, #right_navigation_box a, .cmty-posting-modal {
|
|
/* Source for %border-box */
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* Set box-sizing to content-box */
|
|
#navigation_box, #blog_keywords + div, .cmty-posting-modal .aops-close-x {
|
|
/* Source for %content-box */
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
/* No user select */
|
|
#navigation_box, #header h1, .cmty-posting-preview-bar {
|
|
/* Source for %no-user-select */
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
}
|
|
|
|
/* Pseudo-element shared styles */
|
|
body::after, #content::before {
|
|
/* Source for %pseudo */
|
|
content: '';
|
|
position: absolute;
|
|
}
|
|
|
|
/* Headings */
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6, #navigation_box a, #header h1, .bbcode_quote_head, #user-menu-widget .username-colored, #blog_keywords, .cmty-posting-environ .cmty-heading-text,
|
|
.cmty-posting-environ .cmty-posting-box-container::before, .cmty-posting-subject-line .cmty-subject-input, .cmty-tags-line .cmty-items-input, .aops-modal-title {
|
|
/* Source for %heading */
|
|
font-family: Raleway, Lato, Roboto, 'Segoe UI', 'Lucida Grande', 'DejaVu Sans', sans-serif;
|
|
}
|
|
|
|
/* Import font for modals */
|
|
:root .btn, :root .cmty-editable-item-close, .blog-reply-window, #post-new-entry, .aops-modal-body,
|
|
#flyout, #main::after {
|
|
/* Source for %modal-font */
|
|
font-family: Lato, 'Helvetica Neue', HelveticaNeue, Helvetica, Arial, sans-serif;
|
|
}
|
|
|
|
/* Transitions */
|
|
input[type='text'],
|
|
textarea, .cmty-poll-question,
|
|
.cmty-poll-inputs, :root .btn, :root .cmty-editable-item-close, #navigation_box, #right_navigation_box a, div.entry h2 > a::before, div.comment h2 > a::before, pre::before, #blog_keywords, .cmty-item-tag, .entrywrap .cmty-items-input, div.commentwrap .cmty-items-input {
|
|
/* Source for %transition03 */
|
|
transition: 0.3s ease;
|
|
}
|
|
|
|
/**
|
|
* Modules
|
|
*/
|
|
/**
|
|
* General module
|
|
*
|
|
* Encompasses shared styles for individual component elements
|
|
*/
|
|
a:link,
|
|
a:hover,
|
|
a:visited {
|
|
color: #2b2b2b;
|
|
}
|
|
|
|
a:focus {
|
|
border-bottom: 1px dotted #ccc !important;
|
|
}
|
|
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
/* Rule extends %heading */
|
|
color: inherit;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 1.7em;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 1.2em;
|
|
}
|
|
|
|
[style*='underline'], .message a:link,
|
|
.message a:hover,
|
|
.message a:visited, .cmty-post-preview-text a:link,
|
|
.cmty-post-preview-text a:hover,
|
|
.cmty-post-preview-text a:visited {
|
|
/* Source for %link-underline */
|
|
text-decoration: none !important;
|
|
background-image: linear-gradient(to bottom, currentColor, currentColor);
|
|
background-size: 1px 1px;
|
|
background-repeat: repeat-x;
|
|
background-position: 0 1.06em;
|
|
}
|
|
|
|
[style*='underline'] {
|
|
/* Rule extends %link-underline */
|
|
}
|
|
|
|
input[type='text'],
|
|
textarea,
|
|
.cmty-poll-question,
|
|
.cmty-poll-inputs {
|
|
/* Rule extends %border-box */
|
|
/* Rule extends %transition03 */
|
|
background-color: #fff;
|
|
font-size: inherit;
|
|
}
|
|
|
|
:root input[type='text'],
|
|
:root
|
|
textarea,
|
|
:root .cmty-poll-question,
|
|
:root
|
|
.cmty-poll-inputs {
|
|
border-width: 0 0 1px;
|
|
border-color: #d9d9d9;
|
|
}
|
|
|
|
:root input[type='text']:hover,
|
|
:root
|
|
textarea:hover,
|
|
:root .cmty-poll-question:hover,
|
|
:root
|
|
.cmty-poll-inputs:hover {
|
|
border-color: #ccc;
|
|
}
|
|
|
|
:root input[type='text']:focus,
|
|
:root
|
|
textarea:focus,
|
|
:root .cmty-poll-question:focus,
|
|
:root
|
|
.cmty-poll-inputs:focus {
|
|
border-width: 0 0 1px;
|
|
border-style: solid;
|
|
border-color: #aaa;
|
|
}
|
|
|
|
:root .btn, :root .cmty-editable-item-close {
|
|
/* Rule extends %modal-font */
|
|
/* Rule extends %transition03 */
|
|
background-color: #fff;
|
|
color: #444;
|
|
font-size: inherit;
|
|
line-height: 1.4em;
|
|
padding: 0 0.8em;
|
|
background: none;
|
|
border: none;
|
|
margin: 0;
|
|
width: auto;
|
|
height: 1.4em;
|
|
}
|
|
|
|
:root .btn:hover, :root .cmty-editable-item-close:hover {
|
|
color: #444;
|
|
background-color: #f2f2f2;
|
|
}
|
|
|
|
:root .btn:focus, :root .cmty-editable-item-close:focus {
|
|
background-color: #e6e6e6;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
background-color: #fff;
|
|
width: 0.6rem;
|
|
height: 0.6rem;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: #ccc;
|
|
border: solid #fff;
|
|
border-width: 0.2rem 0.25rem;
|
|
border-radius: 0.5rem;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background-color: #bfbfbf;
|
|
border-width: 0.2rem;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:active {
|
|
background-color: #aaa;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:horizontal {
|
|
border-width: 0.2rem;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:horizontal:hover {
|
|
border-width: 0.15rem;
|
|
}
|
|
|
|
/**
|
|
* Layout module
|
|
*
|
|
* Encompasses body, wrapper, and general layout
|
|
*/
|
|
body {
|
|
font-family:'Titillium Web', sans-serif;
|
|
font-size: 1rem;
|
|
color: #444;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
body::after {
|
|
/* Rule extends %pseudo */
|
|
position: fixed;
|
|
background-image: url("https://cdn.artofproblemsolving.com/images/6/a/2/6a28bd61ace416f184719463cacd5268c000cee3.png");
|
|
background-position: 0;
|
|
background-size: cover;
|
|
z-index: -1;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 25vh;
|
|
}
|
|
|
|
#wrapper {
|
|
/* Rule extends %border-box */
|
|
width: 100%;
|
|
padding: 0;
|
|
background: none;
|
|
border: none;
|
|
}
|
|
|
|
#content {
|
|
position: relative;
|
|
background-color: #fff;
|
|
padding: 0 calc((100% - 48em) / 2);
|
|
padding-top: 5vh;
|
|
margin-top: 72vh;
|
|
}
|
|
|
|
#content::before {
|
|
/* Rule extends %pseudo */
|
|
background-image: linear-gradient(to top, rgba(51, 51, 51, 0.4) 0, rgba(51, 51, 51, 0.1) 60%, transparent 100%);
|
|
top: -15vh;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 100%;
|
|
}
|
|
|
|
#main {
|
|
/* Rule extends %reset-all */
|
|
/* Rule extends %border-box */
|
|
position: relative;
|
|
width: 100%;
|
|
padding-bottom: 3em;
|
|
}
|
|
|
|
/**
|
|
* Header module
|
|
*
|
|
* Encompasses the header and the navigation bar
|
|
*/
|
|
#navigation_box a, #header h1 {
|
|
/* Source for %title */
|
|
/* Rule extends %heading */
|
|
color: #fff;
|
|
text-shadow: 1px 1px 1px rgba(51, 51, 51, 0.6);
|
|
}
|
|
|
|
#navigation_box {
|
|
/* Rule extends %reset-all */
|
|
/* Rule extends %content-box */
|
|
/* Rule extends %no-user-select */
|
|
/* Rule extends %transition03 */
|
|
position: fixed;
|
|
color: transparent;
|
|
background-color: #fff;
|
|
font-size: 1em;
|
|
white-space: nowrap;
|
|
padding: 0 1em;
|
|
border-bottom: 1px solid #e6e6e6;
|
|
opacity: 0.95;
|
|
z-index: 100;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
width: auto;
|
|
height: 3rem;
|
|
}
|
|
|
|
#navigation_box a {
|
|
/* Rule extends %title */
|
|
display: inline;
|
|
color: #333;
|
|
text-shadow: none;
|
|
font-size: inherit;
|
|
font-weight: 300;
|
|
line-height: 3rem;
|
|
padding: 1.1em 0.4em;
|
|
border-top: 0.2em solid #333;
|
|
margin: 0 -0.3em;
|
|
transition: 0.3s ease;
|
|
}
|
|
|
|
#left_navigation_box {
|
|
height: 100%;
|
|
font-size: inherit;
|
|
line-height: inherit;
|
|
}
|
|
|
|
#left_navigation_box a:hover,
|
|
#left_navigation_box a:focus,
|
|
#left_navigation_box a:last-child {
|
|
padding-top: 0.75em;
|
|
color: #1a1a1a;
|
|
}
|
|
|
|
#right_navigation_box {
|
|
position: relative;
|
|
margin-right: 2.7rem;
|
|
width: 7.5em;
|
|
height: 3em;
|
|
}
|
|
|
|
#right_navigation_box a {
|
|
/* Rule extends %border-box */
|
|
/* Rule extends %transition03 */
|
|
position: absolute;
|
|
color: transparent;
|
|
font-size: 0.01px;
|
|
background-color: transparent;
|
|
background-repeat: no-repeat;
|
|
background-size: auto 40%;
|
|
background-position: center;
|
|
width: 2.5rem;
|
|
height: 3rem;
|
|
}
|
|
|
|
#right_navigation_box a:hover, #right_navigation_box a:focus {
|
|
background-color: #e6e6e6;
|
|
border-bottom: none !important;
|
|
}
|
|
|
|
#right_navigation_box .blog-info {
|
|
left: 0;
|
|
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PGNpcmNsZSBpZD0iY2lyY2xlIiBmaWxsPSJub25lIiBzdHJva2U9IiMzMzMiIHI9IjE0IiBjeD0iMTUiIGN5PSIxNSIvPjxjaXJjbGUgaWQ9ImRvdCIgZmlsbD0iIzMzMyIgc3Ryb2tlLXdpZHRoPSIwIiByPSIxIiBjeD0iMTUiIGN5PSI3LjUiLz48cGF0aCBpZD0iaSIgZmlsbD0iIzMzMyIgc3Ryb2tlLXdpZHRoPSIwIiBkPSJtMTIuNSwxMS41bDMuNSwwbDAsMTFxMCwwLjUgMC41LDAuNWwxLDBsMCwxbC01LDBsMCwtMWwxLDBxMC41LDAgMC41LC0wLjVsMCwtOS41cTAsLTAuNSAtMC41LC0wLjVsLTEsMGwwLC0xeiIvPjwvZz48L3N2Zz4=");
|
|
}
|
|
|
|
#right_navigation_box #blog-subscribe {
|
|
left: 2.5rem;
|
|
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyB3aWR0aD0iMjciIGhlaWdodD0iMzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PHBhdGggaWQ9Im1hcmsiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzMzMyIgZD0ibTAuNSwxbDI1LjUsMGwwLDI4LjVsLTEyLjUsLTkuNWwtMTIuNSw5LjVsMCwtMjguNXoiLz48L2c+PC9zdmc+");
|
|
}
|
|
|
|
#right_navigation_box #blog-subscribe[title*='stop'] {
|
|
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyB3aWR0aD0iMjciIGhlaWdodD0iMzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PHBhdGggaWQ9Im1hcmsiIGZpbGw9IiMzMzMiIHN0cm9rZT0iIzMzMyIgZD0ibTAuNSwxbDI1LjUsMGwwLDI4LjVsLTEyLjUsLTkuNWwtMTIuNSw5LjVsMCwtMjguNXoiLz48L2c+PC9zdmc+");
|
|
}
|
|
|
|
#right_navigation_box .blog-login,
|
|
#right_navigation_box .blog-logout {
|
|
left: 5rem;
|
|
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyB3aWR0aD0iMjciIGhlaWdodD0iMzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PHBhdGggaWQ9ImRvb3IiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzMzMyIgZD0ibTEsMWwxOCwwbDAsMTIuNW0wLDRsMCwxMi41bC0xOCwwTDEsLjUiLz48cGF0aCBpZD0iYXJyb3ciIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzMzMyIgZD0ibTEyLDE1LjVsMTQuNSwwTTE2LDExbC00LjUsNC41bDQuNSw0LjUiLz48L2c+PC9zdmc+");
|
|
}
|
|
|
|
#right_navigation_box .blog-logout {
|
|
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyB3aWR0aD0iMjciIGhlaWdodD0iMzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PHBhdGggaWQ9ImRvb3IiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzMzMyIgZD0ibTEsMWwxOCwwbDAsMTIuNW0wLDRsMCwxMi41bC0xOCwwTDEsLjUiLz48cGF0aCBpZD0iYXJyb3ciIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzMzMyIgZD0ibTEyLDE1LjVsMTQuNSwwTTIyLDExbDQuNSw0LjVsLTQuNSw0LjUiLz48L2c+PC9zdmc+");
|
|
}
|
|
|
|
#right_navigation_box .blog-login + .blog-info {
|
|
left: 2.5rem;
|
|
background-color: #fff;
|
|
z-index: 12;
|
|
}
|
|
|
|
#right_navigation_box .blog-login + .blog-info:hover {
|
|
background-color: #e6e6e6;
|
|
}
|
|
|
|
#header {
|
|
position: fixed;
|
|
height: 2em;
|
|
z-index: 0;
|
|
top: calc(36vh - 2.5rem);
|
|
left: 0;
|
|
right: 0;
|
|
background: none;
|
|
border: none;
|
|
}
|
|
|
|
#header h1 {
|
|
/* Rule extends %title */
|
|
/* Rule extends %reset-all */
|
|
/* Rule extends %no-user-select */
|
|
font-size: 5rem;
|
|
font-weight: 200;
|
|
text-decoration: none;
|
|
z-index: 10;
|
|
}
|
|
|
|
#header a:focus h1::before {
|
|
content: '\f015';
|
|
position: absolute;
|
|
font-family: FontAwesome;
|
|
font-size: 0.6em;
|
|
opacity: 0.3;
|
|
margin-left: -1em;
|
|
}
|
|
|
|
/**
|
|
* Entry module
|
|
*
|
|
* Encompasses entries and comments
|
|
*/
|
|
div.actions,
|
|
div.modactions {
|
|
font-size: 0.7em;
|
|
}
|
|
|
|
#main > div:first-child {
|
|
margin-top: 1em;
|
|
}
|
|
|
|
div.entrywrap, div.commentwrap,
|
|
div.entry,
|
|
div.comment {
|
|
line-height: 2em;
|
|
background-color: transparent;
|
|
border: none;
|
|
}
|
|
|
|
div.entrywrap a, div.commentwrap a {
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
div.entry, div.comment {
|
|
position: relative;
|
|
padding: 0 1.2em;
|
|
margin: 0 -1.4em;
|
|
}
|
|
|
|
div.entry h1, div.comment h1 {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
padding-right: 0;
|
|
}
|
|
|
|
div.entry h2, div.comment h2 {
|
|
font-size: 0.9em;
|
|
margin-left: 0.3em;
|
|
}
|
|
|
|
div.entry h2 > a::before, div.comment h2 > a::before {
|
|
/* Rule extends %transition03 */
|
|
content: '\00B6';
|
|
position: absolute;
|
|
color: transparent;
|
|
font-size: 1.7em;
|
|
margin-right: 0.3em;
|
|
top: -2.15rem;
|
|
left: -1em;
|
|
}
|
|
|
|
div.entry h2 img, div.comment h2 img {
|
|
display: none;
|
|
}
|
|
|
|
div.entry h2 .username-colored, div.comment h2 .username-colored,
|
|
div.entry h2 .username-coloured, div.comment h2 .username-coloured {
|
|
color: #090909 !important;
|
|
font-weight: normal;
|
|
}
|
|
|
|
div.entry:hover h2 > a::before, div.comment:hover h2 > a::before {
|
|
color: #ccc;
|
|
}
|
|
|
|
div.commentwrap {
|
|
/* Rule extends .entrywrap */
|
|
padding: 0.5em;
|
|
margin: 0.5em;
|
|
}
|
|
|
|
div.comment {
|
|
/* Rule extends .entry */
|
|
}
|
|
|
|
.cfooter .author {
|
|
margin: 0.7em 0;
|
|
}
|
|
|
|
.cfooter .author::before {
|
|
content: '\2767';
|
|
vertical-align: middle;
|
|
font-size: 1.3em;
|
|
margin-right: 0.1em;
|
|
}
|
|
|
|
.cfooter .author img {
|
|
display: none;
|
|
}
|
|
|
|
.cfooter .author strong {
|
|
font-weight: normal;
|
|
}
|
|
|
|
.message {
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.message a:link,
|
|
.message a:hover,
|
|
.message a:visited {
|
|
/* Rule extends %link-underline */
|
|
}
|
|
|
|
.message a:visited {
|
|
color: #444;
|
|
}
|
|
|
|
.cmty-hide-heading:link,
|
|
.cmty-hide-heading:hover {
|
|
border-bottom: none;
|
|
background-image: linear-gradient(to right, currentColor 0%, currentColor 50%, #fff 50%, #fff 100%);
|
|
background-size: 2px 1px;
|
|
}
|
|
|
|
.cmty-hide-content {
|
|
/* Rule extends %reset-all */
|
|
}
|
|
|
|
.bbcode_quote,
|
|
.bbcode_quote_head,
|
|
.bbcode_quote_body {
|
|
/* Rule extends %reset-all */
|
|
}
|
|
|
|
.bbcode_quote {
|
|
width: 90%;
|
|
margin: auto;
|
|
}
|
|
|
|
.bbcode_quote_head {
|
|
/* Rule extends %heading */
|
|
color: #aaa;
|
|
font-size: 1.1em;
|
|
font-weight: normal;
|
|
margin-left: 1rem;
|
|
}
|
|
|
|
.bbcode_quote_head::before {
|
|
content: '';
|
|
}
|
|
|
|
.bbcode_quote_body {
|
|
font-size: 1.4em;
|
|
margin: 0.5em 1rem;
|
|
}
|
|
|
|
.bbcode_quote_body .bbcode_quote_head {
|
|
font-size: 0.7em;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.bbcode_quote_body .bbcode_quote_body {
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
pre {
|
|
position: relative;
|
|
font-family: Monaco, 'DejaVu Mono', Consolas, monospace;
|
|
white-space: pre;
|
|
overflow-x: auto;
|
|
margin: 0.5em 1rem;
|
|
}
|
|
|
|
pre[class] a:link {
|
|
background-image: none;
|
|
}
|
|
|
|
pre::before {
|
|
/* Rule extends %transition03 */
|
|
content: 'code';
|
|
position: absolute;
|
|
background-color: #fff;
|
|
color: #aaa;
|
|
opacity: 0.8;
|
|
padding: 0 0.7em;
|
|
top: 0;
|
|
right: 0;
|
|
}
|
|
|
|
pre[class]::before {
|
|
content: attr(class);
|
|
}
|
|
|
|
pre:hover::before {
|
|
opacity: 0.2;
|
|
}
|
|
|
|
pre.cpp::before {
|
|
content: 'c++';
|
|
}
|
|
|
|
.cmty-poll-display {
|
|
margin-top: 0;
|
|
margin-bottom: 1em;
|
|
background-color: transparent;
|
|
padding: 0;
|
|
border: none;
|
|
}
|
|
|
|
.cmty-poll-display .cmty-poll-result-bar {
|
|
background-color: #d9d9d9;
|
|
}
|
|
|
|
/**
|
|
* Side module
|
|
*
|
|
* Encompasses sidebar
|
|
*/
|
|
#side {
|
|
padding: 0;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
|
|
#side > div {
|
|
display: none;
|
|
}
|
|
|
|
#user-menu-widget {
|
|
display: block !important;
|
|
font-size: 0.01px;
|
|
}
|
|
|
|
#user-menu-widget p {
|
|
display: none;
|
|
}
|
|
|
|
#user-menu-widget .avatar {
|
|
position: absolute;
|
|
display: block;
|
|
margin-left: -2.5rem;
|
|
top: -2.95rem;
|
|
left: 50%;
|
|
}
|
|
|
|
#user-menu-widget .avatar img {
|
|
background-color: #ccc;
|
|
display: block;
|
|
color: transparent;
|
|
border-radius: 50%;
|
|
border: 1px solid #ccc;
|
|
width: 5rem;
|
|
height: 5rem;
|
|
}
|
|
|
|
#user-menu-widget .username-colored {
|
|
/* Rule extends %heading */
|
|
position: absolute;
|
|
display: block;
|
|
color: transparent;
|
|
font-size: 0.8rem;
|
|
text-overflow: ellipsis;
|
|
line-height: 5rem;
|
|
border-radius: 50%;
|
|
padding: 0.1rem;
|
|
margin-left: -2.5rem;
|
|
overflow: hidden;
|
|
z-index: 1;
|
|
transition: 0.15s 0.06s ease-in;
|
|
top: -2.55rem;
|
|
left: 50%;
|
|
width: 5rem;
|
|
height: 5rem;
|
|
}
|
|
|
|
#user-menu-widget .username-colored::after {
|
|
content: "";
|
|
position: absolute;
|
|
background-image: linear-gradient(to bottom, transparent, transparent 30%, rgba(51, 51, 51, 0.3));
|
|
background-position: 50% 0;
|
|
opacity: 0;
|
|
z-index: -1;
|
|
transition: 0.3s ease-out;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
}
|
|
|
|
#user-menu-widget .username-colored:hover {
|
|
color: #fff;
|
|
text-shadow: 1px 1px 1px rgba(51, 51, 51, 0.6);
|
|
}
|
|
|
|
#user-menu-widget .username-colored:hover::after {
|
|
opacity: 1;
|
|
}
|
|
|
|
#search-widget {
|
|
display: block !important;
|
|
z-index: 10;
|
|
}
|
|
|
|
#search-widget .widget-header,
|
|
#search-widget .widget-content div {
|
|
display: none;
|
|
}
|
|
|
|
fieldset {
|
|
/* Rule extends %reset-all */
|
|
}
|
|
|
|
#blog_keywords {
|
|
/* Rule extends %heading */
|
|
/* Rule extends %transition03 */
|
|
position: fixed;
|
|
top: 0;
|
|
right: 0;
|
|
display: block;
|
|
background-color: transparent;
|
|
border-left: 2.4em solid #fff !important;
|
|
z-index: 100;
|
|
cursor: pointer;
|
|
transition: all 0s linear, width 0.3s ease, background-color 0s 0.3s linear;
|
|
border: none;
|
|
box-shadow: none;
|
|
border-radius: 0;
|
|
width: 0;
|
|
height: 3rem;
|
|
}
|
|
|
|
#blog_keywords:focus {
|
|
width: 15em;
|
|
background-color: #e6e6e6;
|
|
color: #333;
|
|
padding-left: 0.5em;
|
|
padding-right: 3.1em;
|
|
border-left: none !important;
|
|
cursor: auto;
|
|
transition: all 0s linear, width 0.3s ease, background-color 0s linear;
|
|
}
|
|
|
|
#blog_keywords + div {
|
|
/* Rule extends %content-box */
|
|
position: fixed;
|
|
top: -3px;
|
|
right: 0;
|
|
display: block !important;
|
|
font-size: 0;
|
|
overflow: hidden;
|
|
pointer-events: none;
|
|
z-index: 100;
|
|
background-color: transparent;
|
|
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyB3aWR0aD0iMjgiIGhlaWdodD0iMzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PGNpcmNsZSBpZD0iY2lyY2xlIiBmaWxsPSJub25lIiBzdHJva2U9IiMzMzMiIHI9IjEwIiBjeD0iMTEiIGN5PSIxMSIvPjxwYXRoIGlkPSJsaW5lIiBzdHJva2U9IiMzMzMiIGQ9Im0yNy4wNjk2OTEsMzAuMTUxMTFsLTkuNjQxODIxLC0xMS40OTA2NjkiLz48L2c+PC9zdmc+");
|
|
background-repeat: no-repeat;
|
|
background-size: auto 40%;
|
|
background-position: center;
|
|
border-left: 1px solid #e6e6e6;
|
|
transition: background-color 0.3s ease 0.114s, border-right-color 0.3s ease 0.114s;
|
|
width: 2.6rem;
|
|
height: 3rem;
|
|
}
|
|
|
|
#blog_keywords:hover + div {
|
|
background-color: #e6e6e6;
|
|
transition: background-color 0.3s ease;
|
|
}
|
|
|
|
#blog_keywords:focus + div {
|
|
background-color: #e6e6e6;
|
|
border-right-color: #e6e6e6;
|
|
transition: background-color 0.3s ease, border-right-color 0.3s ease;
|
|
}
|
|
|
|
#blog_keywords + div input {
|
|
display: none;
|
|
}
|
|
|
|
/**
|
|
* Posting module
|
|
*
|
|
* Encompasses posting & commenting forms
|
|
*/
|
|
@-webkit-keyframes flash-post-fields {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
5% {
|
|
opacity: 1;
|
|
}
|
|
20% {
|
|
opacity: 0.5;
|
|
}
|
|
27% {
|
|
opacity: 1;
|
|
}
|
|
42% {
|
|
opacity: 0.5;
|
|
}
|
|
49% {
|
|
opacity: 1;
|
|
}
|
|
64% {
|
|
opacity: 0.5;
|
|
}
|
|
71% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
@keyframes flash-post-fields {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
5% {
|
|
opacity: 1;
|
|
}
|
|
20% {
|
|
opacity: 0.5;
|
|
}
|
|
27% {
|
|
opacity: 1;
|
|
}
|
|
42% {
|
|
opacity: 0.5;
|
|
}
|
|
49% {
|
|
opacity: 1;
|
|
}
|
|
64% {
|
|
opacity: 0.5;
|
|
}
|
|
71% {
|
|
opacity: 1;
|
|
}
|
|
100% {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
.cmty-posting-modal {
|
|
/* Rule extends %border-box */
|
|
border-width: 1.8rem;
|
|
border-color: #fff;
|
|
box-shadow: 0 0 10% #444;
|
|
max-width: 100% !important;
|
|
max-height: 100% !important;
|
|
/* autoprefixer: off */
|
|
-webkit-transform: none !important;
|
|
transform: none !important;
|
|
top: 0 !important;
|
|
left: 0 !important;
|
|
right: 0 !important;
|
|
bottom: 0 !important;
|
|
width: 100% !important;
|
|
height: 100% !important;
|
|
}
|
|
|
|
.cmty-posting-modal .aops-close-x {
|
|
/* Rule extends %content-box */
|
|
top: -32px;
|
|
right: -32px;
|
|
color: transparent;
|
|
padding: 1em;
|
|
border-radius: 0;
|
|
background-color: transparent;
|
|
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGc+PHBhdGggaWQ9IngiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzMzMyIgZD0ibTEsMWwyOCwyOG0wLC0yOGwtMjgsMjgiLz48L2c+PC9zdmc+");
|
|
background-repeat: no-repeat;
|
|
background-size: 40%;
|
|
background-position: center;
|
|
background-clip: content-box;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-posting-box-container,
|
|
.cmty-posting-modal .cmty-post-preview {
|
|
width: 50%;
|
|
height: calc(100% - 11.9rem) !important;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-posting-box-container {
|
|
float: left;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-posting-box-container .cmty-post-textarea,
|
|
.cmty-posting-modal .cmty-posting-box-container .cmty-post-textarea:focus {
|
|
border-width: 0;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-post-preview {
|
|
display: block !important;
|
|
float: right;
|
|
border-left: 1px solid #d9d9d9;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-edit-post .cmty-posting-box-container,
|
|
.cmty-posting-modal .cmty-edit-post .cmty-post-preview {
|
|
height: calc(100% - 9.5rem) !important;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-posting-with-poll .cmty-posting-box-container,
|
|
.cmty-posting-modal .cmty-posting-with-poll .cmty-post-preview {
|
|
height: calc(100% - 26.8rem) !important;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-posting-preview-bar {
|
|
position: fixed;
|
|
left: -100%;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-posting-preview-bar-hidden {
|
|
display: none !important;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-posting-preview-bar-shown {
|
|
display: block !important;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-refresh-preview,
|
|
.cmty-posting-modal .cmty-preview-bar-attachments {
|
|
position: fixed;
|
|
bottom: 0;
|
|
font-size: 0.8rem;
|
|
padding: 0.5em;
|
|
margin: 0;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-refresh-preview {
|
|
z-index: 1;
|
|
border-top: 1px solid #d9d9d9;
|
|
left: 1.8rem;
|
|
right: 1.8rem;
|
|
}
|
|
|
|
.cmty-posting-modal .cmty-preview-bar-attachments {
|
|
z-index: 10;
|
|
left: 1.5rem;
|
|
}
|
|
|
|
.cmty-posting-subject-line .cmty-subject-input, .cmty-tags-line .cmty-items-input, .cmty-posting-box-container .cmty-post-textarea {
|
|
/* Source for %faux-placeholder-input */
|
|
position: relative;
|
|
background-color: transparent !important;
|
|
transition: background-color 0.3s 6s ease, border-color 0.3s ease;
|
|
}
|
|
|
|
.cmty-posting-subject-line .cmty-subject-input:focus, .cmty-tags-line .cmty-items-input:focus, .cmty-posting-box-container .cmty-post-textarea:focus {
|
|
background-color: #fff !important;
|
|
transition: background-color 0.3s 0s ease, border-color 0.3s ease;
|
|
}
|
|
|
|
.cmty-posting-environ .cmty-heading-text,
|
|
.cmty-posting-environ .cmty-posting-box-container::before {
|
|
/* Rule extends %heading */
|
|
position: absolute;
|
|
opacity: 0;
|
|
color: #aaa;
|
|
font-size: inherit;
|
|
-webkit-animation: flash-post-fields 6s ease;
|
|
animation: flash-post-fields 6s ease;
|
|
}
|
|
|
|
.cmty-posting-subject-line {
|
|
position: relative;
|
|
font-size: 2.5em;
|
|
padding: 10px 0;
|
|
}
|
|
|
|
.cmty-posting-subject-line .cmty-heading-text {
|
|
margin: 0.3em 0.1em;
|
|
}
|
|
|
|
.cmty-posting-subject-line .cmty-subject-input {
|
|
/* Rule extends %heading */
|
|
/* Rule extends %faux-placeholder-input */
|
|
padding-left: 0.1rem !important;
|
|
width: 100%;
|
|
height: 2em;
|
|
}
|
|
|
|
.cmty-posting-subject-line .cmty-subject-input:focus {
|
|
padding-left: 0.1rem !important;
|
|
}
|
|
|
|
.cmty-posting-subject-line .cmty-post-in {
|
|
display: none;
|
|
}
|
|
|
|
.cmty-tags-line {
|
|
padding: 0;
|
|
}
|
|
|
|
.cmty-tags-line .cmty-heading-text {
|
|
text-align: left;
|
|
margin: 0.2em 0.3em;
|
|
}
|
|
|
|
.cmty-tags-line .cmty-items-input-box {
|
|
background-color: transparent;
|
|
padding: 0;
|
|
border: none;
|
|
}
|
|
|
|
.cmty-tags-line .cmty-items-input {
|
|
/* Rule extends %heading */
|
|
/* Rule extends %faux-placeholder-input */
|
|
padding: 0.3em !important;
|
|
margin-bottom: 0.5em;
|
|
/* Following styles copied from text inputs; see general.scss */
|
|
border-width: 0 0 1px !important;
|
|
border-style: solid !important;
|
|
border-color: #d9d9d9 !important;
|
|
}
|
|
|
|
.cmty-tags-line .cmty-items-input:hover {
|
|
border-color: #ccc !important;
|
|
}
|
|
|
|
.cmty-tags-line .cmty-items-input:focus {
|
|
padding: 0.3em !important;
|
|
border-color: #aaa !important;
|
|
}
|
|
|
|
.cmty-poll-build {
|
|
background-color: #fff;
|
|
color: #444;
|
|
border-bottom: 1px solid #d9d9d9;
|
|
}
|
|
|
|
.cmty-poll-build .cmty-poll-inputs {
|
|
height: 6em;
|
|
resize: none;
|
|
}
|
|
|
|
.cmty-poll-question,
|
|
.cmty-poll-inputs {
|
|
/* Rule extends textarea */
|
|
padding: 0.3em 0.2em;
|
|
}
|
|
|
|
.cmty-poll-question:focus,
|
|
.cmty-poll-inputs:focus {
|
|
padding: 0.3em 0.2em;
|
|
}
|
|
|
|
.cmty-poll-left,
|
|
.cmty-poll-right {
|
|
width: 100%;
|
|
}
|
|
|
|
.cmty-posting-box-container::before {
|
|
content: 'Message';
|
|
font-size: 1.2em;
|
|
margin: 0.3em;
|
|
}
|
|
|
|
.cmty-posting-box-container .cmty-post-textarea {
|
|
/* Rule extends %faux-placeholder-input */
|
|
padding: 0 0.3em;
|
|
}
|
|
|
|
.cmty-posting-box-container .cmty-post-textarea:focus {
|
|
padding: 0 0.3em;
|
|
}
|
|
|
|
.cmty-posting-preview-bar {
|
|
/* Rule extends %no-user-select */
|
|
background-color: #fff;
|
|
color: #444;
|
|
}
|
|
|
|
.cmty-post-preview-text {
|
|
font-family:'Titillium Web', sans-serif;
|
|
word-wrap: break-word;
|
|
padding: 0 1em 1em !important;
|
|
}
|
|
|
|
.cmty-post-preview-text a:link,
|
|
.cmty-post-preview-text a:hover,
|
|
.cmty-post-preview-text a:visited {
|
|
/* Rule extends %link-underline */
|
|
}
|
|
|
|
.cmty-post-preview-text a:visited {
|
|
color: #444;
|
|
}
|
|
|
|
.cmty-posting-top,
|
|
.cmty-posting-button-row {
|
|
color: #444;
|
|
background: none;
|
|
}
|
|
|
|
.cmty-posting-environ-buttons .btn, .cmty-posting-environ-buttons .cmty-editable-item-close {
|
|
vertical-align: top;
|
|
}
|
|
|
|
.cmty-bbcode-btn {
|
|
height: 1.4em;
|
|
}
|
|
|
|
.cmty-bbcode-other {
|
|
color: #444;
|
|
z-index: 0;
|
|
}
|
|
|
|
.blog-reply-window {
|
|
/* Rule extends %modal-font */
|
|
position: relative;
|
|
z-index: 1;
|
|
background-color: #fff;
|
|
display: none !important;
|
|
padding: 0 1em;
|
|
border: 1px solid #fff;
|
|
border-top-color: #e6e6e6;
|
|
}
|
|
|
|
.blog-reply-window.blog-reply-open {
|
|
display: block !important;
|
|
}
|
|
|
|
.blog-reply-window.blog-reply-open::before {
|
|
content: '';
|
|
display: table;
|
|
clear: both;
|
|
}
|
|
|
|
.blog-reply-window .cmty-posting-box-container::before {
|
|
content: 'Comment';
|
|
}
|
|
|
|
.blog-reply-window .cmty-posting-environ {
|
|
top: -2.1em;
|
|
z-index: 1;
|
|
margin-bottom: -2.1em;
|
|
}
|
|
|
|
.blog-reply-window .cmty-posting-button-row {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.blog-reply-window .cmty-cancel-posting-x {
|
|
color: #444;
|
|
}
|
|
|
|
.blog-reply-window .cmty-submit-button {
|
|
float: left;
|
|
}
|
|
|
|
.blog-reply-window .cmty-posting-button-row.cmty-phone {
|
|
margin-bottom: 1.1em;
|
|
}
|
|
|
|
.blog-reply-window .cmty-post-preview {
|
|
border: none;
|
|
}
|
|
|
|
.cmty-edit-post .cmty-heading-text,
|
|
.cmty-edit-post .cmty-posting-box-container::before {
|
|
-webkit-animation: none;
|
|
animation: none;
|
|
}
|
|
|
|
/**
|
|
* Miscellaneous stuff
|
|
*/
|
|
#post-new-entry {
|
|
/* Rule extends %modal-font */
|
|
}
|
|
|
|
#post-new-entry-img {
|
|
display: none;
|
|
}
|
|
|
|
div.post-tags {
|
|
font-size: 0.9em;
|
|
margin-top: 2em;
|
|
}
|
|
|
|
.cmty-item-tag {
|
|
/* Rule extends %transition03 */
|
|
background-color: #fff !important;
|
|
color: #aaa !important;
|
|
font-size: 0.7em;
|
|
}
|
|
|
|
.cmty-item-tag:hover {
|
|
background-color: #e6e6e6 !important;
|
|
}
|
|
|
|
.entrywrap .cmty-items-input, div.commentwrap .cmty-items-input {
|
|
/* Rule extends %transition03 */
|
|
display: inline;
|
|
width: auto;
|
|
background-color: transparent !important;
|
|
padding: 0em 0.2em !important;
|
|
/* Following styles copied from text inputs; see general.scss */
|
|
border-width: 0 0 1px !important;
|
|
border-style: solid !important;
|
|
border-color: #d9d9d9 !important;
|
|
}
|
|
|
|
.entrywrap .cmty-items-input:hover, div.commentwrap .cmty-items-input:hover {
|
|
border-color: #ccc !important;
|
|
}
|
|
|
|
.entrywrap .cmty-items-input:focus, div.commentwrap .cmty-items-input:focus {
|
|
padding: 0em 0.2em !important;
|
|
border-color: #aaa !important;
|
|
}
|
|
|
|
.cmty-editable-item-close {
|
|
/* Rule extends .btn */
|
|
font-family: AoPS;
|
|
}
|
|
|
|
.cmty-editable-item-close:hover {
|
|
background-color: #fff;
|
|
}
|
|
|
|
#feed-wrapper {
|
|
display: none;
|
|
}
|
|
|
|
#main > h1 {
|
|
padding-bottom: 0.2em;
|
|
border-bottom: 1px solid #e6e6e6;
|
|
margin-top: 0.5em;
|
|
margin-bottom: 1.3em;
|
|
}
|
|
|
|
#main > p:not([id]) {
|
|
position: relative;
|
|
float: right;
|
|
z-index: 1;
|
|
margin-top: 1.5em;
|
|
}
|
|
|
|
#main > p:not([id]) a:link,
|
|
#main > p:not([id]) a:hover,
|
|
#main > p:not([id]) a:visited {
|
|
color: #aaa;
|
|
}
|
|
|
|
.aops-modal-title {
|
|
/* Rule extends %heading */
|
|
}
|
|
|
|
.aops-modal-body,
|
|
#flyout {
|
|
/* Rule extends %modal-font */
|
|
}
|
|
|
|
#flyout {
|
|
text-align: left;
|
|
padding-right: 5px;
|
|
}
|
|
|
|
#main::after {
|
|
/* Rule extends %modal-font */
|
|
content: "City made by NMK, with \262d.";
|
|
position: relative;
|
|
top: 2em;
|
|
display: block;
|
|
color: #aaa;
|
|
font-size: 0.8em;
|
|
text-align: center;
|
|
}
|
|
|
|
/**
|
|
* @media module
|
|
*/
|
|
@media all {
|
|
html {
|
|
font-size: 17px;
|
|
}
|
|
}
|
|
|
|
@media only screen and (max-width: 1000px) {
|
|
body::after {
|
|
height: 16rem;
|
|
}
|
|
#content {
|
|
margin-top: 16rem;
|
|
padding-top: 2em;
|
|
padding-left: 2em;
|
|
padding-right: 2em;
|
|
}
|
|
#content::before {
|
|
display: none;
|
|
}
|
|
#header {
|
|
top: 5.75rem;
|
|
}
|
|
#header h1 {
|
|
font-size: 2.5rem;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
}
|
|
#navigation_box {
|
|
font-size: 0;
|
|
opacity: 1;
|
|
}
|
|
#left_navigation_box a:nth-last-child(2) {
|
|
display: inline-block;
|
|
font-size: 1rem;
|
|
padding: 0 0.7em;
|
|
border-top: none;
|
|
}
|
|
#left_navigation_box a:nth-last-child(2):hover {
|
|
background-color: #e6e6e6;
|
|
}
|
|
#left_navigation_box a:nth-last-child(2)::before {
|
|
content: "\3008";
|
|
font-size: 0.9em;
|
|
padding-right: 0.2em;
|
|
}
|
|
#right_navigation_box {
|
|
display: none;
|
|
}
|
|
#blog_keywords + div {
|
|
height: calc(3rem + 1px);
|
|
}
|
|
#blog_keywords:focus {
|
|
width: 100%;
|
|
}
|
|
#user-menu-widget .avatar {
|
|
top: -2.45rem;
|
|
margin-left: -2rem;
|
|
}
|
|
#user-menu-widget .avatar img {
|
|
width: 4rem;
|
|
height: 4rem;
|
|
}
|
|
#user-menu-widget .username-colored {
|
|
display: none;
|
|
}
|
|
div.quotetitle,
|
|
div.quotecontent {
|
|
border-left: 1px solid #ccc;
|
|
padding-left: 0.5rem;
|
|
margin: 0;
|
|
}
|
|
div.quotecontent {
|
|
padding-top: 0.5em;
|
|
}
|
|
.codetitle {
|
|
display: block;
|
|
margin-top: 1em;
|
|
}
|
|
.codetitle b {
|
|
font-weight: normal;
|
|
}
|
|
pre::before {
|
|
display: none;
|
|
}
|
|
.cmty-posting-modal {
|
|
border-top-width: 0;
|
|
border-bottom-width: 0.8rem;
|
|
}
|
|
.aops-modal-open {
|
|
position: fixed;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.cmty-posting-modal .cmty-post-preview,
|
|
.cmty-posting-preview-bar {
|
|
display: none !important;
|
|
}
|
|
.cmty-posting-modal .cmty-posting-box-container {
|
|
width: 100%;
|
|
float: none;
|
|
}
|
|
.cmty-posting-modal .cmty-posting-button-row {
|
|
display: none;
|
|
}
|
|
.cmty-posting-modal .cmty-posting-button-row.cmty-phone {
|
|
display: block;
|
|
}
|
|
.cmty-posting-modal .cmty-posting-button-row.cmty-phone .cmty-posting-environ-buttons {
|
|
width: auto;
|
|
}
|
|
.cmty-posting-modal .cmty-posting-button-row.cmty-phone .btn, .cmty-posting-modal .cmty-posting-button-row.cmty-phone .cmty-editable-item-close {
|
|
display: inline-block;
|
|
width: auto;
|
|
}
|
|
.cmty-post-textarea,
|
|
.cmty-post-textarea:focus {
|
|
border-width: 0 0 1px;
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
|
|
/*Loading bar*/
|
|
@keyframes loading{
|
|
0%{
|
|
width: 0px;
|
|
top: calc(50vh - 50px);
|
|
font-family: VT323;
|
|
content: "Loading...";
|
|
transition: ease;
|
|
text-align: center;
|
|
}
|
|
75%{
|
|
width: 300px;
|
|
top: calc(50vh - 50px);
|
|
font-family: VT323;
|
|
content: "Loading...";
|
|
text-align: center;
|
|
}
|
|
75.1%{
|
|
width: 300px;
|
|
top: calc(50vh - 50px);
|
|
font-family: VT323;
|
|
content: "Done!";
|
|
text-align: center;
|
|
}
|
|
85%{
|
|
top: calc(50vh - 100px);
|
|
width: 300px;
|
|
font-family: VT323;
|
|
content: "Done!";
|
|
text-align: center;
|
|
}
|
|
100%{
|
|
top: calc(150vh - 50px);
|
|
width: 300px;
|
|
font-family: VT323;
|
|
content: "Done!";
|
|
text-align: center;
|
|
}
|
|
}
|
|
html::before{
|
|
font-family: VT323;
|
|
content: "Loading...";
|
|
height: 100px;
|
|
position: fixed !important;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
top: calc(150vh - 50px);
|
|
left: calc(50vw - 150px);
|
|
background-color: black;
|
|
color: white !important;
|
|
line-height: 100px;
|
|
white-space: nowrap;
|
|
font-size: 50px !important;
|
|
z-index: 1000000000 !important;
|
|
animation: loading 2s ease !important;
|
|
width: 300px !important;
|
|
box-shadow: 0px 0px 0px 5px white, 0px 50vw 0px calc(50vw + 50vh - 50px) black, 0px 0px 0px 5px white !important;
|
|
/*The box shadow that makes the border is put before and after the background shadow, because of order issues (Firefox displays the first one on top, chrome displays the last one on top)*/
|
|
display: block !important;
|
|
}
|
|
html::after{
|
|
font-family: VT323;
|
|
content: "Loading... please wait";
|
|
height: 100px;
|
|
width: 0px;
|
|
position: fixed !important;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
top: calc(150vh - 50px);
|
|
left: calc(50vw - 150px);
|
|
background-color: white;
|
|
color: black !important;
|
|
line-height: 100px;
|
|
z-index: 1000000001 !important;
|
|
white-space: nowrap;
|
|
font-size: 50px !important;
|
|
animation: loading 2s ease !important;
|
|
overflow: hidden !important;
|
|
}
|