DEV: Форматирование css, js (по Codacy)

This commit is contained in:
Evg 2023-11-14 08:23:49 +03:00
parent 354ee060c4
commit f09ce2e3f2
27 changed files with 1201 additions and 436 deletions

File diff suppressed because one or more lines are too long

View file

@ -4,7 +4,9 @@
* Стили для каталога
*/
.item-cat { padding: 0 30px 10px 30px; }
.item-cat {
padding: 0 30px 10px 30px;
}
.list-items {
margin: 0;
@ -48,7 +50,7 @@
}
.categories-telo,
.item-categories > div {
.item-categories>div {
width: 33%;
margin-bottom: 10px;
}
@ -59,18 +61,24 @@ body.item.dark .categories-telo a {
color: #fff;
}
body.item.dark .box { background-color: #222; }
body.item.dark .item-categories { background-color: #111; }
body.item.dark .box {
background-color: #222;
}
body.item.dark .item-categories {
background-color: #111;
}
@media (max-width: 890px) {
.item-categories,
.item-cat {
padding: 20px 20px 20px 15px;
}
.categories-telo,
.item-categories > div {
.item-categories>div {
width: 99%;
margin-bottom: 10px;
}
@ -80,5 +88,7 @@ body.item.dark .item-categories { background-color: #111; }
padding-right: .5rem;
}
.list-items { padding: 0 5px 0 0; }
.list-items {
padding: 0 5px 0 0;
}
}

View file

@ -10,12 +10,11 @@
font-family: Roboto;
src: url(/assets/fonts/Roboto-Regular.ttf);
}
body {
font-family: Roboto, -apple-system,BlinkMacSystemFont,Arial,sans-serif;
} */
/* пример 2 (example 2)
body { background-color: #f3f3f3; }

View file

@ -49,153 +49,500 @@ img {
vertical-align: middle;
}
.top-sm { top: 70px; }
.mr-auto { margin: 0 auto; }
.top-sm {
top: 70px;
}
.m0 { margin: 0; }
.m5 { margin: 5px; }
.mt5 { margin-top: 5px; }
.mr5 { margin-right: 5px; }
.mb5 { margin-bottom: 5px; }
.ml5 { margin-left: 5px; }
.mr-auto {
margin: 0 auto;
}
.m10 { margin: 10px; }
.mt10 { margin-top: 10px; }
.mr10 { margin-right: 10px; }
.mb10 { margin-bottom: 10px; }
.ml10 { margin-left: 10px; }
.m0 {
margin: 0;
}
.m15 { margin: 15px; }
.mt15 { margin-top: 15px; }
.mr15 { margin-right: 15px; }
.mb15 { margin-bottom: 15px; }
.ml15 { margin-left: 15px; }
.m5 {
margin: 5px;
}
.mt20 { margin-top: 20px; }
.mr20 { margin-right: 20px; }
.mb20 { margin-bottom: 20px; }
.ml20 { margin-left: 20px; }
.ml30 { margin-left: 30px; }
.mt5 {
margin-top: 5px;
}
.p5 { padding: 5px; }
.p15 { padding: 15px; }
.p5-10 { padding: 5px 10px; }
.p10-5 { padding: 10px 5px; }
.mr5 {
margin-right: 5px;
}
.indent-body { margin: 0 8px; }
.mb5 {
margin-bottom: 5px;
}
.ml5 {
margin-left: 5px;
}
.m10 {
margin: 10px;
}
.mt10 {
margin-top: 10px;
}
.mr10 {
margin-right: 10px;
}
.mb10 {
margin-bottom: 10px;
}
.ml10 {
margin-left: 10px;
}
.m15 {
margin: 15px;
}
.mt15 {
margin-top: 15px;
}
.mr15 {
margin-right: 15px;
}
.mb15 {
margin-bottom: 15px;
}
.ml15 {
margin-left: 15px;
}
.mt20 {
margin-top: 20px;
}
.mr20 {
margin-right: 20px;
}
.mb20 {
margin-bottom: 20px;
}
.ml20 {
margin-left: 20px;
}
.ml30 {
margin-left: 30px;
}
.p5 {
padding: 5px;
}
.p15 {
padding: 15px;
}
.p5-10 {
padding: 5px 10px;
}
.p10-5 {
padding: 10px 5px;
}
.indent-body {
margin: 0 8px;
}
/*
* Used colors (and background) in LibArea project
*
* Используемые цвета (и фон) в проекте LibArea
*/
.black { color: var(--black); }
.white { color: var(--white); }
.yellow { color: var(--yellow); }
.green { color: var(--green); }
.gray { color: var(--gray); }
.gray-600 { color: var(--gray-600); }
.sky { color: var(--sky); }
.red { color: var(--red); }
.brown { color: var(--brown ); }
.black {
color: var(--black);
}
.bg-black { background-color: var(--black); }
.bg-white { background-color: var(--white); }
.bg-green { background-color: var(--green); }
.bg-yellow { background-color: var(--yellow); }
.white {
color: var(--white);
}
.bg-lightyellow { background-color: lightyellow; }
.bg-lightgray { background-color: var(--gray-100); }
.bg-violet { background-color: var(--violet); }
.bg-blue { background-color: var(--blue); }
.bg-red-200 { background-color: var(--red-200); }
.bg-beige { background-color: var(--beige); }
.yellow {
color: var(--yellow);
}
.active { color: var(--red); }
.green {
color: var(--green);
}
.gray {
color: var(--gray);
}
.gray-600 {
color: var(--gray-600);
}
.sky {
color: var(--sky);
}
.red {
color: var(--red);
}
.brown {
color: var(--brown);
}
.bg-black {
background-color: var(--black);
}
.bg-white {
background-color: var(--white);
}
.bg-green {
background-color: var(--green);
}
.bg-yellow {
background-color: var(--yellow);
}
.bg-lightyellow {
background-color: lightyellow;
}
.bg-lightgray {
background-color: var(--gray-100);
}
.bg-violet {
background-color: var(--violet);
}
.bg-blue {
background-color: var(--blue);
}
.bg-red-200 {
background-color: var(--red-200);
}
.bg-beige {
background-color: var(--beige);
}
.active {
color: var(--red);
}
/*
* Other
*
* Другое
*/
.shadow { box-shadow: 0 4px 14px rgba(0,0,0,0.15); }
.shadow-bottom { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); }
.shadow {
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}
.br-gray { border: 1px solid var(--gray-100); }
.br-dotted { border: 1px dotted var(--form-border-color); }
.br-bottom { border-bottom: 1px solid var(--form-border-color); }
.br-lightgray { border: 5px solid var(--gray-100); }
.shadow-bottom {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
li.br-top-zebra + li { border-top: 1px solid var(--gray-100); }
li.br-li-bottom-no:last-child { border-bottom: 1px solid transparent; }
.br-gray {
border: 1px solid var(--gray-100);
}
.w-auto { width: auto; }
.w-20 { width: 20%; }
.w-30 { width: 30%; }
.w-40 { width: 40%; }
.w-50 { width: 50%; }
.w-60 { width: 60%; }
.w-70 { width: 70%; }
.w-90 { width: 90% }
.w-100 { width: 100%; }
.w20 { width: 20px; }
.w30 { width: 30px; }
.w40 { width: 40px; }
.w50 { width: 50px; }
.w60 { width: 60px; }
.w94 { width: 94px; }
.w160 { width: 160px; }
.w200 { width: 200px; }
.br-dotted {
border: 1px dotted var(--form-border-color);
}
.max-w-100 { max-width: 100%; }
.max-w780 { max-width: 780px; }
.max-w300 { max-width: 300px; }
.min-w75 { min-width: 75px; }
.br-bottom {
border-bottom: 1px solid var(--form-border-color);
}
.text-xs { font-size: 0.75rem; }
.text-sm { font-size: 0.875rem; }
.text-base { font-size: 1rem; }
.text-lg { font-size: 1.125rem; }
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }
.text-3xl { font-size: 1.875rem; }
.text-4xl { font-size: 2.25rem; }
.text-5xl { font-size: 3rem; }
.text-6xl { font-size: 3.75rem; }
.text-7xl { font-size: 4.5rem; }
.text-8xl { font-size: 6rem; }
.br-lightgray {
border: 5px solid var(--gray-100);
}
.grid { display: grid; }
.gap { gap: 1rem; }
.gap-min { gap: 0.5rem; }
.gap-max { gap: 2.5rem; }
.flex { display: flex; }
.fixed { position: fixed; }
.flex-row { flex-direction: row; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.flex-nowrap { flex-wrap: nowrap }
.flex-auto { flex: 1 1 0%; }
li.br-top-zebra+li {
border-top: 1px solid var(--gray-100);
}
.clear { clear: both; }
.left { float: left; }
.right { float: right; }
.center { text-align: center; }
.align-right { text-align: right; }
.middle { vertical-align: middle; }
.lowercase { text-transform: lowercase; }
.uppercase { text-transform: uppercase; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.items-center { align-items: center; }
.italic { font-style: italic; }
.sticky { position: sticky; }
.absolute { position: absolute; }
.relative { position: relative; }
.hidden { overflow: hidden; }
.none { display: none; }
.block { display: block; }
.table { display: table; }
.inline { display: inline-block; }
.break-all { word-break:break-all; }
.pointer { cursor: pointer; }
li.br-li-bottom-no:last-child {
border-bottom: 1px solid transparent;
}
.w-auto {
width: auto;
}
.w-20 {
width: 20%;
}
.w-30 {
width: 30%;
}
.w-40 {
width: 40%;
}
.w-50 {
width: 50%;
}
.w-60 {
width: 60%;
}
.w-70 {
width: 70%;
}
.w-90 {
width: 90%
}
.w-100 {
width: 100%;
}
.w20 {
width: 20px;
}
.w30 {
width: 30px;
}
.w40 {
width: 40px;
}
.w50 {
width: 50px;
}
.w60 {
width: 60px;
}
.w94 {
width: 94px;
}
.w160 {
width: 160px;
}
.w200 {
width: 200px;
}
.max-w-100 {
max-width: 100%;
}
.max-w780 {
max-width: 780px;
}
.max-w300 {
max-width: 300px;
}
.min-w75 {
min-width: 75px;
}
.text-xs {
font-size: 0.75rem;
}
.text-sm {
font-size: 0.875rem;
}
.text-base {
font-size: 1rem;
}
.text-lg {
font-size: 1.125rem;
}
.text-xl {
font-size: 1.25rem;
}
.text-2xl {
font-size: 1.5rem;
}
.text-3xl {
font-size: 1.875rem;
}
.text-4xl {
font-size: 2.25rem;
}
.text-5xl {
font-size: 3rem;
}
.text-6xl {
font-size: 3.75rem;
}
.text-7xl {
font-size: 4.5rem;
}
.text-8xl {
font-size: 6rem;
}
.grid {
display: grid;
}
.gap {
gap: 1rem;
}
.gap-min {
gap: 0.5rem;
}
.gap-max {
gap: 2.5rem;
}
.flex {
display: flex;
}
.fixed {
position: fixed;
}
.flex-row {
flex-direction: row;
}
.flex-col {
flex-direction: column;
}
.flex-wrap {
flex-wrap: wrap;
}
.flex-nowrap {
flex-wrap: nowrap
}
.flex-auto {
flex: 1 1 0%;
}
.clear {
clear: both;
}
.left {
float: left;
}
.right {
float: right;
}
.center {
text-align: center;
}
.align-right {
text-align: right;
}
.middle {
vertical-align: middle;
}
.lowercase {
text-transform: lowercase;
}
.uppercase {
text-transform: uppercase;
}
.justify-between {
justify-content: space-between;
}
.justify-center {
justify-content: center;
}
.items-center {
align-items: center;
}
.italic {
font-style: italic;
}
.sticky {
position: sticky;
}
.absolute {
position: absolute;
}
.relative {
position: relative;
}
.hidden {
overflow: hidden;
}
.none {
display: none;
}
.block {
display: block;
}
.table {
display: table;
}
.inline {
display: inline-block;
}
.break-all {
word-break: break-all;
}
.pointer {
cursor: pointer;
}

View file

@ -3,8 +3,8 @@
*
* Кнопки
*/
/* Buttons */
/* Buttons */
.btn {
display: inline-block;
font-weight: 400;
@ -47,6 +47,6 @@
border-color: var(--button-outline-border-color-hover);
}
.focus-id:hover{
.focus-id:hover {
opacity: 0.8;
}

View file

@ -21,10 +21,193 @@ pre {
/* PrismJS 1.25.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+java+kotlin+markup-templating+php+sql&plugins=line-numbers+unescaped-markup+normalize-whitespace */
code[class*=language-],pre[class*=language-]{color:#000;background:0 0;text-shadow:0 1px #fff;font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;/*white-space:pre;*/word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}code[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,pre[class*=language-]::-moz-selection{text-shadow:none;background:#b3d4fc}code[class*=language-] ::selection,code[class*=language-]::selection,pre[class*=language-] ::selection,pre[class*=language-]::selection{text-shadow:none;background:#b3d4fc}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#f5f2f0}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#708090}.token.punctuation{color:#999}.token.namespace{opacity:.7}.token.boolean,.token.constant,.token.deleted,.token.number,.token.property,.token.symbol,.token.tag{color:#905}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#690}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url{color:#9a6e3a;background:hsla(0,0%,100%,.5)}.token.atrule,.token.attr-value,.token.keyword{color:#07a}.token.class-name,.token.function{color:#dd4a68}.token.important,.token.regex,.token.variable{color:#e90}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}
pre[class*=language-].line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}pre[class*=language-].line-numbers>code{position:relative;white-space:inherit}.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.line-numbers-rows>span{display:block;counter-increment:linenumber}.line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}
[class*=lang-] script[type='text/plain'],[class*=language-] script[type='text/plain'],script[type='text/plain'][class*=lang-],script[type='text/plain'][class*=language-]{display:block;font:100% Consolas,Monaco,monospace;white-space:pre;overflow:auto}
code[class*=language-],
pre[class*=language-] {
color: #000;
background: 0 0;
text-shadow: 0 1px #fff;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
font-size: 1em;
text-align: left;
/*white-space:pre;*/
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none
}
code[class*=language-] ::-moz-selection,
code[class*=language-]::-moz-selection,
pre[class*=language-] ::-moz-selection,
pre[class*=language-]::-moz-selection {
text-shadow: none;
background: #b3d4fc
}
code[class*=language-] ::selection,
code[class*=language-]::selection,
pre[class*=language-] ::selection,
pre[class*=language-]::selection {
text-shadow: none;
background: #b3d4fc
}
@media print {
code[class*=language-],
pre[class*=language-] {
text-shadow: none
}
}
pre[class*=language-] {
padding: 1em;
margin: .5em 0;
overflow: auto
}
:not(pre)>code[class*=language-],
pre[class*=language-] {
background: #f5f2f0
}
:not(pre)>code[class*=language-] {
padding: .1em;
border-radius: .3em;
white-space: normal
}
.token.cdata,
.token.comment,
.token.doctype,
.token.prolog {
color: #708090
}
.token.punctuation {
color: #999
}
.token.namespace {
opacity: .7
}
.token.boolean,
.token.constant,
.token.deleted,
.token.number,
.token.property,
.token.symbol,
.token.tag {
color: #905
}
.token.attr-name,
.token.builtin,
.token.char,
.token.inserted,
.token.selector,
.token.string {
color: #690
}
.language-css .token.string,
.style .token.string,
.token.entity,
.token.operator,
.token.url {
color: #9a6e3a;
background: hsla(0, 0%, 100%, .5)
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #07a
}
.token.class-name,
.token.function {
color: #dd4a68
}
.token.important,
.token.regex,
.token.variable {
color: #e90
}
.token.bold,
.token.important {
font-weight: 700
}
.token.italic {
font-style: italic
}
.token.entity {
cursor: help
}
pre[class*=language-].line-numbers {
position: relative;
padding-left: 3.8em;
counter-reset: linenumber
}
pre[class*=language-].line-numbers>code {
position: relative;
white-space: inherit
}
.line-numbers .line-numbers-rows {
position: absolute;
pointer-events: none;
top: 0;
font-size: 100%;
left: -3.8em;
width: 3em;
letter-spacing: -1px;
border-right: 1px solid #999;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.line-numbers-rows>span {
display: block;
counter-increment: linenumber
}
.line-numbers-rows>span:before {
content: counter(linenumber);
color: #999;
display: block;
padding-right: .8em;
text-align: right
}
[class*=lang-] script[type='text/plain'],
[class*=language-] script[type='text/plain'],
script[type='text/plain'][class*=lang-],
script[type='text/plain'][class*=language-] {
display: block;
font: 100% Consolas, Monaco, monospace;
white-space: pre;
overflow: auto
}
/* компенсируем tag*/
.token.tag,
.token.tag:hover { background-color: transparent; }
.token.tag:hover {
background-color: transparent;
}

View file

@ -18,7 +18,7 @@ h5 {
}
.number-notif {
display: none;
display: none;
font-size: .72rem;
color: #fff;
background-color: red;
@ -30,7 +30,9 @@ h5 {
}
.number-notif.show,
.video-pl { display: block; }
.video-pl {
display: block;
}
/* См. https://feathericons.com/ и https://tabler-icons.io/ */
.icons {
@ -51,7 +53,9 @@ h5 {
height: 48px;
}
.icon-small { width: 15px; }
.icon-small {
width: 15px;
}
.list-none {
list-style: none;
@ -71,7 +75,9 @@ h5 {
margin-bottom: 15px;
}
.medium-zoom--opened .d-header { display: none; }
.medium-zoom--opened .d-header {
display: none;
}
.banner {
background-image: url(/assets/images/banner-fon.jpg);
@ -127,7 +133,7 @@ h5 {
.box-results {
position: absolute;
border-radius: 3px;
box-shadow: 0 2px 4px -1px rgba(0,0,0,.15);
box-shadow: 0 2px 4px -1px rgba(0, 0, 0, .15);
background-color: var(--white);
padding: 15px;
z-index: 2;
@ -139,9 +145,12 @@ h5 {
position: relative;
width: 100%;
font-size: 18px;
white-space: nowrap; /* Запрещаем перенос строк */
overflow: hidden; /* Обрезаем все, что не помещается в область */
text-overflow: ellipsis; /* Добавляем многоточие */
white-space: nowrap;
/* Запрещаем перенос строк */
overflow: hidden;
/* Обрезаем все, что не помещается в область */
text-overflow: ellipsis;
/* Добавляем многоточие */
}
.v-line {
@ -152,8 +161,9 @@ h5 {
vertical-align: middle;
}
.d-header.scroll-hide-search.show .box-search { display: none; }
/* end */
.d-header.scroll-hide-search.show .box-search {
display: none;
}
.box-logo {
width: 209px;
@ -170,7 +180,9 @@ h5 {
text-overflow: ellipsis;
}
aside { width: 340px; }
aside {
width: 340px;
}
aside ul {
list-style: none;
@ -179,7 +191,9 @@ aside ul {
font-size: 0.9375rem;
}
aside ul a { color: var(--gray); }
aside ul a {
color: var(--gray);
}
blockquote {
margin-left: 15px;
@ -195,10 +209,12 @@ blockquote {
word-wrap: break-word;
padding: 0.1rem 1rem;
border-left: 3px solid #d2d6dd;
font-size:.91rem
font-size: .91rem
}
.blockquote-profile p { margin: 2px; }
.blockquote-profile p {
margin: 2px;
}
hr {
border: none;
@ -220,7 +236,7 @@ summary {
font-size: 14px;
}
details[open] > summary {
details[open]>summary {
padding: 0 0 10px 0;
color: #666;
}
@ -292,7 +308,9 @@ details[open] > summary {
padding: 0.5rem 0;
}
ul.last-content li { margin-bottom: 15px; }
ul.last-content li {
margin-bottom: 15px;
}
ul.last-content a.last-content_telo {
display: block;
@ -307,17 +325,28 @@ ul.last-content a.last-content_telo {
font-weight: 500;
}
a:hover > img,
.trigger img { opacity: 0.8; }
a:hover>img,
.trigger img {
opacity: 0.8;
}
.focus-id:hover { cursor: pointer }
.underline-hover:hover { text-decoration: underline; }
.focus-id:hover {
cursor: pointer
}
.underline-hover:hover {
text-decoration: underline;
}
.content-body {
max-width: 810px;
overflow-wrap: break-word;
}
.content_tree {
word-wrap: break-word;
}
.content_tree:target,
.content_tree.edit {
background-clip: content-box;
@ -332,7 +361,9 @@ ol.bg-red-200 {
}
.bg-red-200 .content_tree,
.content_tree.bg-red-200 { background-color: var(--red-200); }
.content_tree.bg-red-200 {
background-color: var(--red-200);
}
.ind-first-p p {
margin: 0.5em 0;
@ -344,7 +375,9 @@ article iframe {
max-height: 320px;
}
video { max-width: 560px; }
video {
max-width: 560px;
}
.qa-comment {
font-size: 0.875rem;
@ -364,8 +397,8 @@ video { max-width: 560px; }
}
.scroll-menu::-webkit-scrollbar {
width:0;
height:0
width: 0;
height: 0
}
.scroll-wrapper {
@ -390,24 +423,39 @@ video { max-width: 560px; }
gap: 1rem;
}
.content_tree { word-wrap: break-word; }
/*
* Share icons
*
* Иконки, поделиться
*/
.icon-share {
color: #fff;
height: 28px;
width: 28px;
margin: 3px;
}
.bg-vk { background-color: #07f; }
.bg-ok { background-color: #eb722e; }
.bg-tg { background-color: #64a9dc; }
.bg-fb { background-color: #3b5998; }
.bg-lj { background-color: #0d425a; }
.bg-tw { background-color: #00aced; }
.bg-vk {
background-color: #07f;
}
.bg-ok {
background-color: #eb722e;
}
.bg-tg {
background-color: #64a9dc;
}
.bg-fb {
background-color: #3b5998;
}
.bg-lj {
background-color: #0d425a;
}
.bg-tw {
background-color: #00aced;
}

View file

@ -33,4 +33,6 @@ footer ul li a {
}
footer ul li a:hover,
footer .icon:hover { color: var(--footer-color-active); }
footer .icon:hover {
color: var(--footer-color-active);
}

View file

@ -39,7 +39,9 @@
height: 160px;
}
.trigger img.img-base:hover { opacity: 0.7; }
.trigger img.img-base:hover {
opacity: 0.7;
}
.profile-ava {
position: absolute;
@ -53,13 +55,43 @@
width: 100%;
}
.profile-bg-img.bg-profile { height: 90px; }
.profile-bg-img.bg-profile {
height: 90px;
}
.medium-zoom-overlay {position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .3s;will-change:opacity}
.medium-zoom--opened .medium-zoom-overlay{cursor:pointer;cursor:zoom-out;opacity:1}
.medium-zoom-image{cursor:pointer;cursor:zoom-in;transition:transform .3s cubic-bezier(.2,0,.2,1)}
.medium-zoom-image--hidden{visibility:hidden}
.medium-zoom-image--opened{position:relative;cursor:pointer;cursor:zoom-out;will-change:transform}
.medium-zoom-overlay {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 0;
transition: opacity .3s;
will-change: opacity
}
.medium-zoom--opened .medium-zoom-overlay {
cursor: pointer;
cursor: zoom-out;
opacity: 1
}
.medium-zoom-image {
cursor: pointer;
cursor: zoom-in;
transition: transform .3s cubic-bezier(.2, 0, .2, 1)
}
.medium-zoom-image--hidden {
visibility: hidden
}
.medium-zoom-image--opened {
position: relative;
cursor: pointer;
cursor: zoom-out;
will-change: transform
}
.img-preview {
max-width: 780px;
@ -70,13 +102,20 @@
max-width: 100%;
border: 1px solid #f3f3f3;
}
.img-preview img:hover { box-shadow: 0 1px 8px 0 rgb(0 0 0 / 20%); }
.cut-post img,
.content-body img,
.medium-zoom-image { max-width: 100%; }
.medium-zoom-image {
max-width: 100%;
}
.CodeMirror-line { max-width: 800px; }
.img-preview img:hover {
box-shadow: 0 1px 8px 0 rgb(0 0 0 / 20%);
}
.CodeMirror-line {
max-width: 800px;
}
img.emoji {
max-width: 20px;

View file

@ -4,14 +4,18 @@
* Стили для форм
*/
input, select, textarea {
input,
select,
textarea {
background-color: var(--form-bg-color);
border: 1px solid var(--form-border-color);
color: var(--form-text-color);
font-size: 16px;
}
textarea { width: 100%; }
textarea {
width: 100%;
}
fieldset input:not([type=radio]):not([type=checkbox]):not([type=range]),
fieldset select {
@ -37,7 +41,9 @@ fieldset.error input {
}
input:focus,
textarea:focus { border: 1px solid var(--form-color-active); }
textarea:focus {
border: 1px solid var(--form-color-active);
}
label {
display: block;
@ -45,4 +51,6 @@ label {
font-size: 0.875rem;
}
::placeholder { color: var(--gray); }
::placeholder {
color: var(--gray);
}

View file

@ -4,17 +4,40 @@
* Медиа-запросы
*/
main { width: calc(100% - 590px); }
.admin main { width: calc(100% - 210px); }
.menuno main { width: calc(100% - 340px); }
.menuno main.w-100 { width: 100%; }
main {
width: calc(100% - 590px);
}
.admin main {
width: calc(100% - 210px);
}
.menuno main {
width: calc(100% - 340px);
}
.menuno main.w-100 {
width: 100%;
}
@media (max-width: 1050px) {
.menu__left, #togglemenu { display: none; }
aside { min-width: 240px; }
main { width: calc(100% - 250px); }
.admin main { width: 100%; }
.menu__left,
#togglemenu {
display: none;
}
aside {
min-width: 240px;
}
main {
width: calc(100% - 250px);
}
.admin main {
width: 100%;
}
.menu__button {
transition: 0.3s ease;
@ -38,7 +61,7 @@ main { width: calc(100% - 590px); }
}
.menu__left.menu__active,
.menu__left.menu-none.menu__active {
.menu__left.menu-none.menu__active {
opacity: 1;
visibility: visible;
transition: 0.25s;
@ -46,7 +69,9 @@ main { width: calc(100% - 590px); }
display: block;
}
.menu__left.menu__active ul.top-sm { top: 0; }
.menu__left.menu__active ul.top-sm {
top: 0;
}
.menu__left.menu__active .menu li {
background-color: #fff;
@ -55,31 +80,69 @@ main { width: calc(100% - 590px); }
}
@media (max-width: 780px) {
.mb-w80 { width: 80px; }
.mb-w150 { width: 150px; }
.mb-p10 { padding: 10px; }
.mb-mt5 { margin-top: 5px; }
.mb-mt25 { margin-top: 25px; }
.mb-ml10 { margin-left: 10px; }
.mb-text-xl { font-size: 1.25rem; }
.logo { font-size: 18px; }
.gap-max { gap: 1.5rem; }
.footer ul { padding-left: 0; }
.mb-w80 {
width: 80px;
}
.mb-w150 {
width: 150px;
}
.mb-p10 {
padding: 10px;
}
.mb-mt5 {
margin-top: 5px;
}
.mb-mt25 {
margin-top: 25px;
}
.mb-ml10 {
margin-left: 10px;
}
.mb-text-xl {
font-size: 1.25rem;
}
.logo {
font-size: 18px;
}
.gap-max {
gap: 1.5rem;
}
.footer ul {
padding-left: 0;
}
.mb-img-2xl {
height: 65px;
width: 65px;
}
.box-cover-img { height: 75px; }
.title { font-size: 1.2125rem; }
.box-cover-img {
height: 75px;
}
.title {
font-size: 1.2125rem;
}
.mb-block,
#contentWrapper { display: block; }
#contentWrapper {
display: block;
}
.mb-w-100,
iframe,
video { width: 100%; }
video {
width: 100%;
}
.box {
padding: 1rem;
@ -88,14 +151,18 @@ main { width: calc(100% - 590px); }
aside,
.mb-none,
ul.setting > li > a > i { display: none; }
ul.setting>li>a>i {
display: none;
}
main,
.menuno main { width: 100%; }
.menuno main {
width: 100%;
}
.wrap {
padding-left: 0;
padding-right: 0;
}
}
}

View file

@ -9,7 +9,9 @@
padding-right: 20px;
}
.menuno .menu__left { display: none; }
.menuno .menu__left {
display: none;
}
.dropdown,
.menu,
@ -56,9 +58,11 @@
font-size: 0.975rem;
}
.user-nav li a { margin-left: 10px; }
/* end */
.user-nav li a {
margin-left: 10px;
}
/* end */
.dropdown.left {
left: 0;
@ -66,22 +70,25 @@
}
.menu a,
.dropdown li > a,
.dropdown li > div {
.dropdown li>a,
.dropdown li>div {
color: var(--gray);
padding: 5px;
display: flex;
flex-direction: row;
align-items: center;
gap: .7rem;
font-size: 0.875rem;
}
.dropdown li:hover > a,
.dropdown li > a.active,
.dropdown li > div.active { color: var(--link-color-hover); }
.dropdown li:hover>a,
.dropdown li>a.active,
.dropdown li>div.active {
color: var(--link-color-hover);
}
.menu__left:not(.menu__active) li { margin-bottom: 3px; }
.menu__left:not(.menu__active) li {
margin-bottom: 3px;
}
.menu li.active,
.menu li:hover {
@ -89,15 +96,22 @@
border-radius: var(--border-radius);
}
.menu li:hover { transition-duration: .3s; }
.menu li:hover > a { color: var(--gray); }
.menu li:hover {
transition-duration: .3s;
}
.menu li:hover>a {
color: var(--gray);
}
.breadcrumbs li {
display: inline;
color: var(--gray-600);
color: var(--gray-600);
}
.breadcrumbs li:not(:last-child):after { content: " / "; }
.breadcrumbs li:not(:last-child):after {
content: " / ";
}
/* Navigation */
ul.nav {
@ -109,24 +123,42 @@ ul.nav {
padding: 0;
}
ul.nav > li { padding: 6px 12px; }
ul.nav.small > li { padding: 3px 6px; }
ul.nav > li > a { color: var(--gray-600); }
ul.nav>li {
padding: 6px 12px;
}
ul.nav > li.active {
ul.nav.small>li {
padding: 3px 6px;
}
ul.nav>li>a {
color: var(--gray-600);
}
ul.nav>li.active {
background-color: var(--nav-bg-active);
border-radius: var(--border-radius);
color: var(--nav-color-active);
}
ul.nav > li.active > a { color: var(--nav-color-active); }
ul.nav > li a:hover { color: var(--link-color-hover); }
ul.nav > li.active a:hover { color: var(--nav-color-active); }
ul.nav>li.active>a {
color: var(--nav-color-active);
}
ul.nav>li a:hover {
color: var(--link-color-hover);
}
ul.nav>li.active a:hover {
color: var(--nav-color-active);
}
/* If it's tabs */
.content-tabs { display: none; }
.content-tabs {
display: none;
}
.content-tabs.tab_active {
display: block;
color: var(--nav-color-active);
}
}

View file

@ -13,6 +13,7 @@
width: 100%;
height: 100%;
}
.model-inner {
background-color: white;
border-radius: var(--border-radius);
@ -20,12 +21,14 @@
padding: 2em;
margin: auto;
}
.modal-header {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 2px solid black;
}
}
.overlay {
width: 100%;
height: 100%;
@ -94,5 +97,7 @@
}
@media screen and (min-width: 700px) {
.dialog-close { top: 5px; }
.dialog-close {
top: 5px;
}
}

View file

@ -18,9 +18,11 @@
text-decoration: none;
z-index: 2147483647;
}
.notice-bottom {
bottom: 1rem;
}
.notice-center {
left: 0;
margin-left: auto;
@ -28,25 +30,32 @@
max-width: fit-content;
right: 0;
}
.notice-left {
left: 1rem;
}
.notice-right {
right: 1rem;
}
.notice-top {
top: 1rem;
}
@keyframes toastEffect {
0% {
opacity: 0;
}
100% {
opacity: 0;
}
20% {
opacity: 1;
}
80% {
opacity: 1;
}

View file

@ -29,9 +29,8 @@
color: var(--gray);
}
progress, /* Все браузеры с поддержкой HTML5. */
progress[role] /* polyfill */
{
progress,
progress[role] {
/* Отключает стилизацию — обычно не требуется, но полезно знать. */
appearance: none;
-moz-appearance: none;
@ -53,7 +52,9 @@ progress {
overflow: hidden;
}
::-webkit-progress-bar { background: #f8f8f8; }
::-webkit-progress-bar {
background: #f8f8f8;
}
/* См. https://libarea.ru/post/1384/dev-protestiruem-opros-prikreplennyy-k-postu
progress::-webkit-progress-bar,
@ -63,12 +64,12 @@ progress::-moz-progress-bar { background: #0085ee; } */
progress[value^="0"]::-moz-progress-bar,
progress[value^="1"]::-moz-progress-bar,
progress[value^="2"]::-moz-progress-bar,
progress[value^="2"]::-moz-progress-bar,
progress[value^="0"]::-webkit-progress-value,
progress[value^="1"]::-webkit-progress-value,
progress[value^="2"]::-webkit-progress-value {
background-color: #0ea5e9;
}
}
@ -96,5 +97,4 @@ progress[value="100"]::-moz-progress-bar,
progress[value^="9"]::-webkit-progress-value,
progress[value="100"]::-webkit-progress-value {
background-color: red;
}
}

View file

@ -22,4 +22,6 @@ table thead th {
text-align: left;
}
table tr:nth-of-type(2n) { background-color: var(--gray-100); }
table tr:nth-of-type(2n) {
background-color: var(--gray-100);
}

View file

@ -104,4 +104,4 @@
.tagify--noTags[required] {
--tags-border-color: var(--red);
}
}

View file

@ -29,7 +29,18 @@
right: auto;
}
.dropdown.user { padding: 1rem .7rem .7rem 0; }
.d-header_contents .btn-outline-primary { width: 120px; }
.box-search { margin: 10px 0 10px 45px; }
.block-answer .right { float: left; }
.dropdown.user {
padding: 1rem .7rem .7rem 0;
}
.d-header_contents .btn-outline-primary {
width: 120px;
}
.box-search {
margin: 10px 0 10px 45px;
}
.block-answer .right {
float: left;
}

View file

@ -14,16 +14,16 @@ body.dark {
--nav-bg-active: #161f27;
--nav-color-active: #fff;
--dropdown-bg: #202b38;
--dropdown-box-shadow: 0 6px 18px 0 rgba(14,21,47,.13),0 -2px 6px rgba(14,21,47,.03);
--dropdown-box-shadow: 0 6px 18px 0 rgba(14, 21, 47, .13), 0 -2px 6px rgba(14, 21, 47, .03);
--form-color-active: #1e2830;
--form-bg-color: #283541;
--form-border-color: #252830;
--form-text-color: #fff;
--border-radius: 3px;
--border-radius: 3px;
--button-text-color: #fff;
--button-bg-color: #0085ee;
@ -43,13 +43,13 @@ body.dark {
--header-logo-color: #fff;
--header-form-bg-color: #161f27;
--header-form-text-color: #fff;
--footer-bg: #040a0f;
--footer-box-shadow: 0 -5px 5px -5px rgb(0 0 0 / 15%);
--footer-text-color: #eee;
--footer-color-active: #ccc;
/* Colors used */
/* Colors used */
--black: #fff;
--white: #161f27;
--gray: #a7a7a7;
@ -57,21 +57,26 @@ body.dark {
--violet: #161f27;
--slate-100: #161f27;
}
body.dark .EasyMDEContainer .CodeMirror {
background-color: var(--form-bg-color);
color: var(--form-text-color);
}
}
body.dark .box { background-color: var(--gray-100); }
body.dark .tagify { background-color: var(--form-bg-color); }
body.dark .box {
background-color: var(--gray-100);
}
body.dark .tagify {
background-color: var(--form-bg-color);
}
body.dark .bg-lightyellow,
body.dark .menu__left.menu__active .menu li {
background-color: var(--form-bg-color);
}
body.dark .content_tree:target,
body.dark .content_tree:target,
body.dark .content_tree.edit {
background-color: var(--form-bg-color);
}
@ -79,4 +84,4 @@ body.dark .content_tree.edit {
body.dark blockquote {
background-color: #5f5f67;
border-left: 3px solid #6d6e6f;
}
}

View file

@ -5,10 +5,10 @@
*/
:root {
--font-family: -apple-system,BlinkMacSystemFont,Arial,sans-serif;
--font-family: -apple-system, BlinkMacSystemFont, Arial, sans-serif;
--line-height: 1.5;
--font-size: 1rem;
/* Default (light) theme */
--bg-color: #fff;
--text-color: #030303;
@ -18,12 +18,12 @@
--nav-bg-active: #fcebd9;
--nav-color-active: #332f2f;
--dropdown-bg: #fff;
--dropdown-box-shadow: 0 6px 18px 0 rgba(14,21,47,.13),0 -2px 6px rgba(14,21,47,.03);
--border-radius: 3px;
--dropdown-box-shadow: 0 6px 18px 0 rgba(14, 21, 47, .13), 0 -2px 6px rgba(14, 21, 47, .03);
--border-radius: 3px;
--form-color-active: #3595f6;
--form-bg-color: #fff;
--form-border-color: #ddd;
@ -47,14 +47,13 @@
--header-logo-color: #111;
--header-form-bg-color: #f3f4f6;
--header-form-text-color: #333;
--footer-bg: #fff;
--footer-box-shadow: 0 -5px 5px -5px rgb(0 0 0 / 15%);
--footer-text-color: #9ca3af;
--footer-color-active: #332f2f;
/* Colors used */
/* Colors used */
--black: #030303;
--white: #fff;
--yellow: #f7f7eb;

View file

@ -1,9 +1,9 @@
<?php
use Hleb\Constructor\Handlers\Request;
use Hleb\Constructor\Handlers\Request;
Request::getHead()->addStyles('/assets/css/style.css?' . config('assembly-js-css.version'));
Request::getHead()->addStyles('/assets/css/catalog.css?' . config('assembly-js-css.version'));
Request::getHead()->addStyles('/assets/css/style.css?' . config('assembly-js-css.version'));
Request::getHead()->addStyles('/assets/css/catalog.css?' . config('assembly-js-css.version'));
?>

View file

@ -12,62 +12,62 @@ $q = $data['q'];
<body <?php if (Request::getCookie('dayNight') == 'dark') : ?>class="dark" <?php endif; ?>>
<header class="d-header">
<div class="d-header_contents">
<div class="box-logo">
<a title="<?= __('app.home'); ?>" class="logo" href="/"><?= config('meta.name'); ?></a>
</div>
<div class="box-search">
<form method="get" action="<?= url('search.go'); ?>">
<input type="text" name="q" value="<?= $q; ?>" placeholder="<?= __('search.find'); ?>" class="search">
<input name="cat" value="<?= $uri; ?>" type="hidden">
<?= csrf_field() ?>
</form>
<div class="box-results none" id="search_items"></div>
</div>
<?php if (!UserData::checkActiveUser()) : ?>
<div class="flex gap-max items-center">
<div id="toggledark" class="gray-600">
<svg class="icons">
<use xlink:href="/assets/svg/icons.svg#sun"></use>
</svg>
</div>
<?php if (config('general.invite') == false) : ?>
<a class="gray min-w75 center mb-none block" href="<?= url('register'); ?>">
<?= __('app.registration'); ?>
</a>
<?php endif; ?>
<a class="btn btn-outline-primary min-w75" href="<?= url('login'); ?>">
<?= __('app.sign_in'); ?>
</a>
</div>
<?php else : ?>
<div class="flex gap-max items-center">
<a id="toggledark" class="gray-600 mb-none"><svg class="icons">
<use xlink:href="/assets/svg/icons.svg#sun"></use>
</svg></a>
<a id="notif" class="gray-600 relative mb-none" href="<?= url('notifications'); ?>">
<svg class="icons">
<use xlink:href="/assets/svg/icons.svg#bell"></use>
</svg>
<span class="number-notif"></span>
</a>
<div class="relative">
<div class="trigger pointer">
<?= Img::avatar(UserData::getUserAvatar(), UserData::getUserLogin(), 'img-base', 'small'); ?>
</div>
<div class="dropdown user">
<?= insert('/_block/navigation/menu-user'); ?>
</div>
</div>
</div>
<?php endif; ?>
<div class="d-header_contents">
<div class="box-logo">
<a title="<?= __('app.home'); ?>" class="logo" href="/"><?= config('meta.name'); ?></a>
</div>
<div class="box-search">
<form method="get" action="<?= url('search.go'); ?>">
<input type="text" name="q" value="<?= $q; ?>" placeholder="<?= __('search.find'); ?>" class="search">
<input name="cat" value="<?= $uri; ?>" type="hidden">
<?= csrf_field() ?>
</form>
<div class="box-results none" id="search_items"></div>
</div>
<?php if (!UserData::checkActiveUser()) : ?>
<div class="flex gap-max items-center">
<div id="toggledark" class="gray-600">
<svg class="icons">
<use xlink:href="/assets/svg/icons.svg#sun"></use>
</svg>
</div>
<?php if (config('general.invite') == false) : ?>
<a class="gray min-w75 center mb-none block" href="<?= url('register'); ?>">
<?= __('app.registration'); ?>
</a>
<?php endif; ?>
<a class="btn btn-outline-primary min-w75" href="<?= url('login'); ?>">
<?= __('app.sign_in'); ?>
</a>
</div>
<?php else : ?>
<div class="flex gap-max items-center">
<a id="toggledark" class="gray-600 mb-none"><svg class="icons">
<use xlink:href="/assets/svg/icons.svg#sun"></use>
</svg></a>
<a id="notif" class="gray-600 relative mb-none" href="<?= url('notifications'); ?>">
<svg class="icons">
<use xlink:href="/assets/svg/icons.svg#bell"></use>
</svg>
<span class="number-notif"></span>
</a>
<div class="relative">
<div class="trigger pointer">
<?= Img::avatar(UserData::getUserAvatar(), UserData::getUserLogin(), 'img-base', 'small'); ?>
</div>
<div class="dropdown user">
<?= insert('/_block/navigation/menu-user'); ?>
</div>
</div>
</div>
<?php endif; ?>
</div>
</header>
<div class="ml20">
<ul class="nav inline">

View file

@ -96,15 +96,15 @@ queryAll(".up-id")
let number = parseInt(upScr.innerText);
if (!number) {
number = 0;
number = 0;
}
if (act == true) {
new_cont = (number - parseInt(1));
new_cont = (number - parseInt(1));
} else {
new_cont = (number + parseInt(1));
new_cont = (number + parseInt(1));
}
upVot.classList.toggle('active');
upScr.innerHTML = new_cont;
});
@ -140,10 +140,10 @@ queryAll(".add-poll")
})
.then(response => response.text())
.then(text => {
location.reload();
location.reload();
});
}));
// Deleting a voting option
delVotingOption.forEach(el => el.addEventListener("click", function (e) {
makeRequest("/poll/option/del", options = { body: "id=" + el.dataset.id + "&_token=" + token })
@ -159,7 +159,7 @@ queryAll(".add-ignore")
})
.then(response => response.text())
.then(text => {
location.reload();
location.reload();
});
}));
@ -236,7 +236,7 @@ queryAll(".editcomm")
}));
}
);
}));
}));
// Add post tab
const tabs_post = document.querySelector(".tabs-post");
@ -256,13 +256,12 @@ if (tabs_post) {
});
getById('inputQa').value = 0;
if (id == 'qa') {
if (id == 'qa') {
getById('inputQa').value = 1;
}
const element = getById(id);
element.classList.add("tab_active");
}
}
}

View file

@ -43,9 +43,9 @@ function fetchSearchUrl() {
let obj = JSON.parse(text);
let html = '<div class="flex">';
for (let key in obj) {
if (obj[key].item_id) {
html += '<a class="block green text-sm mt5 mb5" href="/web/website/' + obj[key].item_id + '">' + obj[key].item_url + '</a>';
}
if (obj[key].item_id) {
html += '<a class="block green text-sm mt5 mb5" href="/web/website/' + obj[key].item_id + '">' + obj[key].item_url + '</a>';
}
html += '</div>';
}

View file

@ -115,20 +115,20 @@ function fetchSearch() {
let obj = JSON.parse(text);
let html = '<div class="flex">';
for (let key in obj) {
if (type == 'category') {
if (obj[key].facet_slug) {
html += '<a class="sky block text-sm mb15 mr10" href="/web/dir/all/' + obj[key].facet_slug + '">' + obj[key].facet_title + '</a>';
}
if (obj[key].item_id) {
html += '<a class="block black text-sm mb10" href="/web/website/' + obj[key].item_id + '">' + obj[key].title + '</a>';
}
} else {
if (obj[key].facet_slug) {
html += '<a class="sky block text-sm mb15 mr10" href="/topic/' + obj[key].facet_slug + '">' + obj[key].facet_title + '</a>';
}
if (obj[key].post_id) {
html += '<a class="block black text-sm mb10" href="/post/' + obj[key].post_id + '">' + obj[key].title + '</a>';
}
if (type == 'category') {
if (obj[key].facet_slug) {
html += '<a class="sky block text-sm mb15 mr10" href="/web/dir/all/' + obj[key].facet_slug + '">' + obj[key].facet_title + '</a>';
}
if (obj[key].item_id) {
html += '<a class="block black text-sm mb10" href="/web/website/' + obj[key].item_id + '">' + obj[key].title + '</a>';
}
} else {
if (obj[key].facet_slug) {
html += '<a class="sky block text-sm mb15 mr10" href="/topic/' + obj[key].facet_slug + '">' + obj[key].facet_title + '</a>';
}
if (obj[key].post_id) {
html += '<a class="block black text-sm mb10" href="/post/' + obj[key].post_id + '">' + obj[key].title + '</a>';
}
}
html += '</div>';
}
@ -305,73 +305,73 @@ if (tabs) {
/* MIT license https://github.com/vivekweb2013/toastmaker */
(function (global, factory) {
if (typeof define === "function" && define.amd) {
define(factory);
} else if (typeof exports === "object") {
module.exports = factory();
} else {
global.Notice = factory();
}
if (typeof define === "function" && define.amd) {
define(factory);
} else if (typeof exports === "object") {
module.exports = factory();
} else {
global.Notice = factory();
}
}(this, function (global) {
var Notice = function (text, timeout, options) {
// Validate mandatory options
var validate = function (arg, argName, type, isMandatory, allowedValues) {
var actualType = Array.isArray(arg) ? "array" : typeof arg;
if (isMandatory && (arg == null || arg === ''))
throw new Error("Invalid argument '" + argName + "'. Argument is either empty, null or undefined");
if (actualType !== type)
throw new Error("Invalid argument '" + argName + "'. Type must be " + type + " but found " + actualType);
if (allowedValues && allowedValues.indexOf(arg) == -1)
throw new Error("Invalid value " + arg + " specified for argument '" + argName + "'. Allowed - " + allowedValues.join(" | "));
}
// Initialize & validate the options
validate(text, "text", "string", true);
options = options || {};
validate(options, "options", "object");
timeout = timeout || 3000;
validate(timeout, "timeout", "number");
options.styles = options.styles || {}; // Object with style properties
validate(options.styles, "styles", "object");
options.align = options.align || "center" // left | center | right
validate(options.align, "align", "string", true, ["left", "center", "right"]);
options.valign = options.valign || "bottom"; // top | bottom
validate(options.valign, "valign", "string", true, ["top", "bottom"]);
options.classList = options.classList || [];
validate(options.classList, "classList", "array");
var alignmentClasses = ["notice", "notice-" + options.valign, "notice-" + options.align];
options.classList = options.classList.concat(alignmentClasses) // Array of css class names
// Create toast element
var toast = document.createElement('div');
// Add css classes to toast element
options.classList.forEach(function (c) {
if (typeof c != "string") throw new Error("Invalid css class '" + JSON.stringify(c) + "'. CSS class must be of type string");
toast.classList.add(c);
});
// Add text message to toast element
var content = document.createTextNode(text);
toast.appendChild(content);
// Add styles to the toast element
toast.style.animationDuration = timeout / 1000 + "s";
for (var prop in options.styles) {
if (typeof options.styles[prop] != 'string' && typeof options.styles[prop] != "number")
throw new Error("Invalid value '" + JSON.stringify(options.styles[prop]) + "' specified for style '" +
prop + "'. Style value must be of type string or number");
toast.style[prop] = options.styles[prop];
}
// Inject toast element to DOM
document.body.appendChild(toast);
setTimeout(function () {
document.body.removeChild(toast);
}, timeout);
var Notice = function (text, timeout, options) {
// Validate mandatory options
var validate = function (arg, argName, type, isMandatory, allowedValues) {
var actualType = Array.isArray(arg) ? "array" : typeof arg;
if (isMandatory && (arg == null || arg === ''))
throw new Error("Invalid argument '" + argName + "'. Argument is either empty, null or undefined");
if (actualType !== type)
throw new Error("Invalid argument '" + argName + "'. Type must be " + type + " but found " + actualType);
if (allowedValues && allowedValues.indexOf(arg) == -1)
throw new Error("Invalid value " + arg + " specified for argument '" + argName + "'. Allowed - " + allowedValues.join(" | "));
}
return Notice;
// Initialize & validate the options
validate(text, "text", "string", true);
options = options || {};
validate(options, "options", "object");
timeout = timeout || 3000;
validate(timeout, "timeout", "number");
options.styles = options.styles || {}; // Object with style properties
validate(options.styles, "styles", "object");
options.align = options.align || "center" // left | center | right
validate(options.align, "align", "string", true, ["left", "center", "right"]);
options.valign = options.valign || "bottom"; // top | bottom
validate(options.valign, "valign", "string", true, ["top", "bottom"]);
options.classList = options.classList || [];
validate(options.classList, "classList", "array");
var alignmentClasses = ["notice", "notice-" + options.valign, "notice-" + options.align];
options.classList = options.classList.concat(alignmentClasses) // Array of css class names
// Create toast element
var toast = document.createElement('div');
// Add css classes to toast element
options.classList.forEach(function (c) {
if (typeof c != "string") throw new Error("Invalid css class '" + JSON.stringify(c) + "'. CSS class must be of type string");
toast.classList.add(c);
});
// Add text message to toast element
var content = document.createTextNode(text);
toast.appendChild(content);
// Add styles to the toast element
toast.style.animationDuration = timeout / 1000 + "s";
for (var prop in options.styles) {
if (typeof options.styles[prop] != 'string' && typeof options.styles[prop] != "number")
throw new Error("Invalid value '" + JSON.stringify(options.styles[prop]) + "' specified for style '" +
prop + "'. Style value must be of type string or number");
toast.style[prop] = options.styles[prop];
}
// Inject toast element to DOM
document.body.appendChild(toast);
setTimeout(function () {
document.body.removeChild(toast);
}, timeout);
}
return Notice;
}));

View file

@ -5,11 +5,11 @@
*/
function getById(id) {
return document.getElementById(id);
return document.getElementById(id);
};
function queryAll(id) {
return document.querySelectorAll(id);
return document.querySelectorAll(id);
};
function isIdEmpty(elmId) {

View file

@ -76,9 +76,9 @@
function getPosts(path) {
fetch(path)
.then(res => res.text()).then((res) => {
if (getById("no_content")) {
return;
}
if (getById("no_content")) {
return;
}
scroll.insertAdjacentHTML("beforeend", res);
postPage += 1;
})