# HG changeset patch # User Coffee CMS # Date 1728686423 0 # Node ID 78edf6b517a0d2f92bdec934b299f76673f80981 24.10 diff -r 000000000000 -r 78edf6b517a0 .cms/.unlicense.txt --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/.unlicense.txt Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,24 @@ +This is free and unencumbered software released into the public domain. + +Anyone is free to copy, modify, publish, use, compile, sell, or +distribute this software, either in source code form or as a compiled +binary, for any purpose, commercial or non-commercial, and by any +means. + +In jurisdictions that recognize copyright laws, the author or authors +of this software dedicate any and all copyright interest in the +software to the public domain. We make this dedication for the benefit +of the public at large and to the detriment of our heirs and +successors. We intend this dedication to be an overt act of +relinquishment in perpetuity of all present and future rights to this +software under copyright law. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. +IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR +OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, +ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR +OTHER DEALINGS IN THE SOFTWARE. + +For more information, please refer to \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/admin.cms/html.php --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/admin.cms/html.php Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,467 @@ + $pre_expire ) { + $new_expire = time() + $expire_days * 24 * 60 * 60; + if ( PHP_VERSION_ID < 70300 ) { + setcookie( "sess", $sess, $new_expire ); + } else { + setcookie( "sess", $sess, array( "SameSite" => "Lax", "expires" => $new_expire ) ); + } + // Так же запомнить в конфиге + $cms["config"]["logged"][$sess]["expire"] = $new_expire; + cms_save_config(); + } + } + + // Для работы выпадающего списка + if ( empty( $cms["config"]["locale"] ) ) { + $cms["config"]["locale"] = "en_US.UTF-8"; + $cms["config"]["lang"] = "en"; + } + if ( ! empty( $_GET["locale"] ) ) { + $cms["config"]["locale"] = $_GET["locale"]; + $cms["config"]["lang"] = substr( $_GET["locale"], 0, 2 ); + } + + // Login + if ( isset( $_POST["login"] ) && isset( $_POST["password"] ) ) { + + // Install process + if ( empty( $cms["config"]["admin.mod.php"]["admin_login"] ) + && empty( $cms["config"]["admin.mod.php"]["admin_password"] ) + && ( ! empty( $_POST["login"] ) || ! empty( $_POST["password"] ) ) ) { + $cms["config"]["admin.mod.php"]["admin_login"] = $_POST["login"]; + $cms["config"]["admin.mod.php"]["admin_password"] = $_POST["password"]; + $cms["config"]["admin.mod.php"]["admin_salt"] = cms_uid(); + $cms["config"]["admin.mod.php"]["admin_url"] = "-admin"; + $link = "{$cms['url']['scheme']}://{$cms['url']['host']}{$cms['base_path']}{$cms['config']['admin.mod.php']['admin_url']}"; + + // Set Locale and Timezone + $cms["config"]["locale"] = $_POST["locale"]; + $cms["config"]["lang"] = substr( $cms["config"]["locale"], 0, 2 ); + cms_save_config(); + + if ( is_email( $cms["config"]["admin.mod.php"]["admin_login"] ) ) { + $subject = __( "install_finished" ); + $body = __( "congrat" ) . "\n\n"; + $body .= __( "install_finished" ) . "\n\n"; + $body .= __( "login_info" ) . "\n\n"; + $body .= __( "login_url" ) . ": {$link}\n\n"; + $body .= __( "login" ) . ": {$_POST['login']}\n\n"; + $body .= __( "password" ) . ": {$_POST['password']}"; + cms_email( array( + "type" => "text/plain", + "from_email" => "noreply@" . $cms["url"]["host"], + "from_name" => $cms["url"]["host"], + "to_email" => $_POST["login"], + "subject" => $subject, + "email_body" => $body, + ) ); + } + } + // Check login and password + if ( $_POST["login"] === $cms["config"]["admin.mod.php"]["admin_login"] && + $_POST["password"] === $cms["config"]["admin.mod.php"]["admin_password"] ) + { + + $d = date( "Y-m-d H:i:s" ); + $sess = sha1( $cms["config"]["admin.mod.php"]["admin_login"] . $cms["config"]["admin.mod.php"]["admin_salt"] . $d ); + + // Prepend New Session + if ( ! isset( $cms["config"]["logged"] ) ) { + $cms["config"]["logged"] = array(); + } + $cms["config"]["logged"] = array( + $sess => array( + "ip" => $_SERVER["REMOTE_ADDR"], + "date" => $d, + "user_agent" => $_SERVER["HTTP_USER_AGENT"], + "expire" => $expire, + ) + ) + $cms["config"]["logged"]; + + // Set Locale and Timezone + $cms["config"]["locale"] = $_POST["locale"]; + $cms["config"]["lang"] = substr( $cms["config"]["locale"], 0, 2 ); + + if ( cms_save_config() ) { + + if ( PHP_VERSION_ID < 70300 ) { + setcookie( "sess", $sess, $expire ); + } else { + setcookie( "sess", $sess, array( "SameSite" => "Lax", "expires" => $expire ) ); + } + + $cms["status"] = "302"; + $cms["status_302_location"] = $cms["base_path"] . $cms["config"]["admin.mod.php"]["admin_url"]; + return; + + } else { + + $error_message = __( "cant_write_config" ) . " .cms/config.php"; + + } + + } else { + + $error_message = __( "access_denied" ); + + } + } + + // Тема + if ( isset( $_COOKIE["theme"] ) && in_array( $_COOKIE["theme"], array( 0, 2 ) ) ) { + $pref_bg = "#1e1d1d"; + } else { + $pref_bg = "#e9e0dd"; + } + $styles = array( "dark", "light", "dark classic" ); + if ( isset( $_COOKIE["theme"] ) ) { + $html_classes = $styles[ $_COOKIE["theme"] ]; + } else { + $html_classes = "dark"; + } + +?> + +" class=""> + + + + <?php echo $cms['url']['host']; ?> + img/favicon.svg"> + + + + "; + + echo "\n"; + ?> + + + + + + + + + +
+
+ +
+ + +
+ + + + +
+ +" . __( "hello_set_base" ) . "

"; + } else { + $base_ok = ""; + } + + echo " +
+
+
{$hello}
+ {$base_ok} +
+
"; + + foreach( $cms["admin_pages"] as $name => $page ) { + echo "
{$page}
"; + } + +?> + +
+ +
+ +
+ +
+ + + + + +
+ +
+ + + +
+
+
+ +
+ + {$lang}
"; + } + ?> +
+
+
+
+ +
+
+
+
+ +
+
+
+
+ +
+ + + +
+
+ +
+
+ + + + + + + diff -r 000000000000 -r 78edf6b517a0 .cms/css/admin.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/css/admin.css Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,3483 @@ +:root { + --sans-serif: "Segoe UI", "Nunito", "Noto Sans", "Ubuntu", system-ui, sans-serif; + --monospace: "Consolas", "Hack", "Ubuntu Mono", monospace; +} +/* FreeBSD: pkg install google-fonts */ + + +/*#region Colors Dark*/ +html.dark { + color-scheme: dark; /*Scroll*/ + /*Colors*/ + /*Backgrounds Universal*/ + --bg-2: #111111; + --bg-3: #1e1d1d; + --bg-4: #383433; + --bg-5: #171717; + + /*Border Mediateka*/ + --w-1: #000000; + --br-3: #333333; + --br-active: #a79080; + --file-input: #1e1d1d; + --file-border: #383433; + --font-bg: #1e1d1d; + --ext: #ffe3cf; + /*End*/ + + /*Colors*/ + --white: #ffffff; + --black: #000000; + --orange: #ff4e00; + --green-3: #5d7d25; + --changes: #00ffff; + + --focus-orange: #ff4d0021; + --saved-bg: #405200; + /*End*/ + + --windows: #2e2b2b; + --windows-hover: #282525; + --windows-font: #d5bfae; + + --input-bg: var(--bg-3); + --input-border: var(--bg-4); + --input-font: var(--text); + --button-bg: var(--bg-3); + --button-border: var(--bg-3); + /*End*/ + + /*Modules Universal Properties*/ + --buttons-font: #a79080; + --buttons-hover: #e9c3a6; + --buttons-open: #e4845a; + + --link: #d09074; + --link-hover: #ffcab3; + --link-none: #d5bdac; + + --names: #b98675; + --text: #cccccc; + + --add-page-btn-br: #383433; + --add-page-btn-font: #9b8b84; + /*End*/ + + /*Admin-Header*/ + --header-menu-hover: #f0743f; + --menu-icon-span: #d09074; + + /*Admin-Info-Notice*/ + --info-success: #e9e0ddcc; + --info-error: #940002c4; + --info-fonts-success: #000000; + --info-fonts-error: #ffffff; + + /*Admin-Aside*/ + --aside-section-div: #8f786f; + --aside-section-a: #eabca9; + --aside-section-a-hover: #38343340; + --aside-section-a-active: #38343373; + --aside-section-a-red: #9f2624; + + /*Admin-Modul-Auth*/ + --setup-auth: #b5978e; + --sess-table-font: #b3aaa3; + --sess-table-current: #78ca78; + --auth-del-sess-hover: var(--bg-4); + + /*Milk*/ + --mobile-menu-open-milk: #18101071; + + /*Template*/ + --template-files-file: #a38174; + --template-files-file-hover: #c49b8c; + + /*Admin Menu*/ + + + /*PHP Info*/ + --phpinfo-font: #a38173; + --phpinfo-h-bg: #373434; + --phpinfo-v-i-font: #b39393; + --phpinfo-hr-bg: #615858; + + /*Pages*/ + --page-search: #1b1a1a; + + --add-page-btn-hover: var(--bg-4); + --add-page-btn-svg-b-plus: #9b8b84; + --saved: #87d94f; + --error: #a00000; + --hidden: #a71a1a; + + --del-pages-btn-svg: #9b8b84; + + --pages-grid-div-open: #181717; + --pages-grid-div-open-shadow: #b26044; + + --page-date: #9b8b84; + --page-date-planned: #ffe4c4; + + --main-footer-pager-div-hover: #d09074; + --main-footer-pager-div-active-font: #ffcab3; + --pages-main-footer-pager-div-bg-active: #e875432e; + + --lbox-window: #000000dd; + --shadows: 0 2px 2px 0 #00000033; + + /*Tags*/ + --tags-bg: #282525; + --tags-font: darkgray; + + /*Codemirror*/ + --codemirror-bg: #302c2c; + --codemirror-text: #d5d0cc; + --codemirror-numbeslines: #897067; + --codemirror-numbes-bg: #343232; + + /*Menu*/ + --open-menu: #191919; + --menu-menu-open-prop: var(--buttons-open); + --save-menu: #8bc34a; + + + --menu-input-bg: var(--bg-3); + --menu-input-border: var(--bg-4); + + --menu-item-bg-hover-open: var(--windows); + + --menu-item-a: var(--link); + --menu-item-a-hover: var(--link-hover); + --menu-item-a-none-link: var(--link-none); + + --menu-item-open-prop: var(--buttons-open); + + --menu-menu-buttons-div: var(--buttons-font); + --menu-menu-buttons-div-hover: var(--buttons-hover); + + --menu-input-select-font-disabled: #746c6a; + + --menu-item-select-dropdown-font: #d7c0b6; + --menu-item-field-search-input-bg: #101010; + --menu-item-field-search-input-focus: #786050; + --menu-item-list-search-li-hover-active: #101010; + + --sub-line: #00c0d8; + + + /*Modules*/ + --modules-grid-div-disabled: #2a2828; + --modules-grid-div-disabled-hover: #2a2828; + --disabled-module: #6c6565; + --enabled-module-description: #a08c81; + --disabled-module-sw-btn: #89d3be; + --shadow: #00000073; + --blur-bg: #1e1d1d73; + --blur-font: #d5bfae; + + /*Individual*/ + --category-parents: #726a6a; + + /*Icons*/ + --search-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 489.68 489.68'%3E%3Cdefs%3E%3Cstyle%3E.a-search%7Bfill:%23d09074;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a-search' d='M0,196.4C0,304.9,88,392.83,196.5,392.8A196.53,196.53,0,0,0,320.1,349l135,135A20.44,20.44,0,0,0,484,455.1l-135-135c68.29-84.31,55.3-208-29-276.3A196.42,196.42,0,0,0,196.4,0C88,0,0,87.9,0,196.4Zm40.8,0A155.6,155.6,0,1,1,196.4,352h0A155.66,155.66,0,0,1,40.8,196.4Z'/%3E%3C/svg%3E"); + + --select-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23888888' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"); + + --pages-pin-off: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16.46'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bfill:none;stroke:%23b26044;stroke-miterlimit:10;stroke-width:2px;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='a' points='1 0 1 14.72 7 11.22 13 14.72 13 0 1 0'/%3E%3Cpolyline class='b' points='1 0 1 14.72 7 11.22 13 14.72 13 0'/%3E%3C/svg%3E"); + + --pages-pin-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16.46'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:%23b26044;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='a' points='14 16.46 7 12.38 0 16.46 0 0 14 0 14 16.46'/%3E%3C/svg%3E"); + + --check-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); + + --eye-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 111 111'%3E%3Cdefs%3E%3Cstyle%3E.a,.c%7Bfill:none;%7D.b%7Bfill:%23beafa2;%7D.c%7Bstroke:%23beafa2;stroke-miterlimit:10;stroke-width:7px;%7D%3C/style%3E%3C/defs%3E%3Crect class='a' width='111' height='111'/%3E%3Cpath class='b' d='M55.61,93A57.36,57.36,0,0,1,2,56.45l-.5-1.28L2,53.88A57.36,57.36,0,0,1,55.61,17.37h0a57.36,57.36,0,0,1,53.65,36.51l.49,1.27-.48,1.27C101,77.94,79,93,55.61,93ZM9,55.17A50.39,50.39,0,0,0,55.61,86c20.06,0,39-12.6,46.61-30.8A50.37,50.37,0,0,0,55.61,24.37h0A50.37,50.37,0,0,0,9,55.17Z' transform='translate(-0.11)'/%3E%3Cpath class='b' d='M55.61,80.17a25,25,0,1,1,25-25A25,25,0,0,1,55.61,80.17Zm0-41.55A16.55,16.55,0,1,0,72.16,55.17,16.57,16.57,0,0,0,55.61,38.62Z' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M103.77,88.28' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M19.55,7.34' transform='translate(-0.11)'/%3E%3C/svg%3E"); + + --eye-off: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 111 111'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;%7D.b%7Bstroke:%23beafa2;stroke-miterlimit:10;stroke-width:7px;%7D.c%7Bfill:%23beafa2;%7D%3C/style%3E%3C/defs%3E%3Crect class='a' width='111' height='111'/%3E%3Cpath class='b' d='M103.77,88.28' transform='translate(-0.11)'/%3E%3Cpath class='b' d='M19.55,7.34' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M78.12,66A25,25,0,0,0,44.75,32.66l6.55,6.55A16.49,16.49,0,0,1,71.57,59.48Z' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M109.26,53.88A57.36,57.36,0,0,0,55.61,17.37h0a58.11,58.11,0,0,0-21.89,4.26l5.44,5.44a51.16,51.16,0,0,1,16.45-2.7,50.37,50.37,0,0,1,46.61,30.81A49.46,49.46,0,0,1,87,74.93l5,5a56.18,56.18,0,0,0,17.29-23.47l.48-1.27Z' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M86.21,84l-5.08-5.08h0l-7-7-6-6L44.83,42.64l-6-6L32.22,30h0l-5.16-5.17h0L12.17,10,7.22,14.93,21.07,28.78A57.62,57.62,0,0,0,2,53.88l-.5,1.29L2,56.45A57.36,57.36,0,0,0,55.61,93,57,57,0,0,0,79.79,87.5L97,104.67l5-5L86.2,84ZM62.5,70.21a16.37,16.37,0,0,1-6.89,1.51A16.56,16.56,0,0,1,39.06,55.17a16.3,16.3,0,0,1,1.52-6.88ZM55.61,86A50.39,50.39,0,0,1,9,55.17,50.55,50.55,0,0,1,26.09,33.8l8.26,8.26a24.73,24.73,0,0,0-3.74,13.11A25,25,0,0,0,68.73,76.44l5.76,5.76A49.74,49.74,0,0,1,55.61,86Z' transform='translate(-0.11)'/%3E%3C/svg%3E"); + + + --inter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.5 31.5'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;%7D.a%7Bstroke:%23d09074;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M404.15,357.31l6-6-6-6' transform='translate(-386.5 -335.5)'/%3E%3Cline class='a' x1='7.75' y1='15.75' x2='22.75' y2='15.75'/%3E%3Ccircle class='a' cx='15.75' cy='15.75' r='14'/%3E%3Crect class='b' width='31.5' height='31.5'/%3E%3C/svg%3E"); + + --icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 37.47 37.61'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;stroke:%23d09074;stroke-linecap:round;stroke-width:5px;%7D.b%7Bstroke-linejoin:round;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M4.17,18.91H35.22' transform='translate(-0.25 -0.1)'/%3E%3Cpolyline class='b' points='18.81 35.12 2.5 18.81 18.81 2.5'/%3E%3C/svg%3E"); + + --icon-sub-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 39.97 37.62'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;stroke:%23d09074;stroke-linecap:round;stroke-linejoin:round;stroke-width:5px;%7D%3C/style%3E%3C/defs%3E%3Cpolyline class='a' points='18.81 35.13 2.5 18.82 18.81 2.5'/%3E%3Cpolyline class='a' points='37.47 35.12 21.16 18.81 37.47 2.5'/%3E%3C/svg%3E"); + + --icon-link: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36.86 18.94'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;stroke:%23d09074;stroke-linecap:round;stroke-width:3px;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M22.06,10.83H27.7a8,8,0,0,1,8,8h0a8,8,0,0,1-8,8H22.06' transform='translate(-0.3 -9.33)'/%3E%3Cpath class='a' d='M15.41,26.78H9.77a8,8,0,0,1-8-8h0a8,8,0,0,1,8-8h5.64' transform='translate(-0.3 -9.33)'/%3E%3Cline class='a' x1='8.31' y1='9.47' x2='28.56' y2='9.47'/%3E%3C/svg%3E"); + + --icon-clear: url("data:image/svg+xml,%0A%3Csvg version='1.1' viewBox='0 0 37.819 37.819' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.a-clear%7Bfill:none;stroke-linecap:round;stroke-width:5;stroke:%23d09074%7D%3C/style%3E%3Cg transform='translate(-32.072 -86.124)'%3E%3Cpath class='a-clear' d='m32.34 86.392 37.284 37.284'/%3E%3Cpath class='a-clear' d='m69.624 86.392-37.284 37.284'/%3E%3C/g%3E%3C/svg%3E"); + + --icon-clear-wb: url("data:image/svg+xml,%0A%3Csvg version='1.1' viewBox='0 0 37.819 37.819' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.a-clear%7Bfill:none;stroke-linecap:round;stroke-width:5;stroke:%23ffffff%7D%3C/style%3E%3Cg transform='translate(-32.072 -86.124)'%3E%3Cpath class='a-clear' d='m32.34 86.392 37.284 37.284'/%3E%3Cpath class='a-clear' d='m69.624 86.392-37.284 37.284'/%3E%3C/g%3E%3C/svg%3E"); + + --icon-save: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 769.83 769.83'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;stroke:%23d09074;stroke-miterlimit:10;stroke-width:55px;%7D%3C/style%3E%3C/defs%3E%3Ccircle class='a' cx='384.91' cy='384.91' r='102.48'/%3E%3Cpath class='a' d='M750.91,258.62V687.83a63.08,63.08,0,0,1-63.08,63.08H89.17a63.08,63.08,0,0,1-63.08-63.08h0V89.17A63.08,63.08,0,0,1,89.17,26.09H518.38A98.74,98.74,0,0,1,588.17,55L722,188.83A98.74,98.74,0,0,1,750.91,258.62Z' transform='translate(-3.59 -3.59)'/%3E%3Cpath class='a' d='M464.15,26.09V129.44A46.11,46.11,0,0,1,418,175.55H187.48a46.11,46.11,0,0,1-46.11-46.11V26.09' transform='translate(-3.59 -3.59)'/%3E%3C/svg%3E"); + + --icon-trash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35 35'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;%7D.a%7Bstroke:%239b8b84;stroke-miterlimit:10;stroke-width:1.7px;%7D%3C/style%3E%3C/defs%3E%3Cline class='a' x1='9.63' y1='12.04' x2='25.38' y2='12.04'/%3E%3Cline class='a' x1='15.14' y1='8.75' x2='19.86' y2='8.75'/%3E%3Cpath class='a' d='M23.87,14.77v8.84a2.68,2.68,0,0,1-2.68,2.64H13.82a2.68,2.68,0,0,1-2.64-2.64V14.77'/%3E%3Cline class='a' x1='15.33' y1='15.89' x2='15.33' y2='21.96'/%3E%3Cline class='a' x1='19.69' y1='15.89' x2='19.69' y2='21.96'/%3E%3Crect class='b' width='35' height='35'/%3E%3C/svg%3E"); + + --noise: url(../img/noise-dark.png); +} +/*#endregion Color Dark*/ + +/*#region Colors Light*/ +html.light { + color-scheme: light; /*Scroll*/ + /*Colors*/ + /*Backgrounds Universal*/ + --bg-2: #f8f2f2; + --bg-3: #e9e0dd; + --bg-4: #fffbfb; + --bg-5: #e9e0dd; + + /*Border Mediateka*/ + --w-1: #ffffff; + --br-3: #fbf0ed; + --br-active: #a79080; + --file-input: #1e1d1d; + --file-border: #383433; + --font-bg: #e9e0dd; + --ext: #8f572f; + /*End*/ + + /*Colors*/ + --white: #ffffff; + --black: #000000; + --orange: #ff4e00; + --green-3: #71b300; + --changes: #ea8000; + + --focus-orange: #ff4d0021; + --saved-bg: #ddffab; + /*End*/ + + --windows: #f7efee; + --windows-hover: #fbf5f5; + --windows-font: #604c44; + + --input-bg: var(--bg-4); + --input-border: #c9bfbc; + --input-font: var(--text); + --button-bg: var(--bg-4); + --button-border: var(--bg-4); + /*End*/ + + /*Modules Universal Properties*/ + --buttons-font: #604c44; + --buttons-hover: #93614e; + --buttons-open: #c12a1b; + + --link: #764646; + --link-hover: #bb381a; + --link-none: #7a7a7a; + + --names: #4f3b58; + --text: #333333; + + --add-page-btn-br: #c9bfbc; + --add-page-btn-font: #534e4c; + /*End*/ + + /*Admin-Header*/ + --header-menu-hover: #9b2e00; + --menu-icon-span: #c33b00; + + /*Admin-Info-Notice*/ + --info-success: #4c3a36bf; + --info-error: #940002c4; + --info-fonts-success: #ffffff; + --info-fonts-error: #ffffff; + + /*Admin-Aside*/ + --aside-section-div: #8f786f; + --aside-section-a: #382218; + --aside-section-a-hover: #fffbfb4d; + --aside-section-a-active: #fffbfb91; + --aside-section-a-red: #ff8585; + + /*Admin-Modul-Auth*/ + --setup-auth: #b5978e; + --sess-table-font: #52473d; + --sess-table-current: #008917; + --auth-del-sess-hover: var(--bg-4); + + /*Milk*/ + --mobile-menu-open-milk: #18101071; + + /*Template*/ + --template-files-file: #563d40; + --template-files-file-hover: #9b4d4d; + + /*Admin Menu*/ + + + /*PHP Info*/ + --phpinfo-font: #563939; + --phpinfo-h-bg: #d7cac7; + --phpinfo-v-i-font: #b39393; + --phpinfo-hr-bg: #615858; + + /*Pages*/ + --page-search: #f7efee; + + --add-page-btn-hover: var(--bg-4); + --add-page-btn-svg-b-plus: #9b8b84; + --saved: #157800; + --error: #e20000; + --hidden: #dd10c7; + + --del-pages-btn-svg: #9b8b84; + + --pages-grid-div-open: #e9e0dd; + --pages-grid-div-open-shadow: #ff8562; + + --page-date: #8d5f4b; + --page-date-planned: #cf390c; + + --main-footer-pager-div-hover: #bb381a; + --main-footer-pager-div-active-font: #bb381a; + --pages-main-footer-pager-div-bg-active: #d5bfaeeb; + + --lbox-window: #000000dd; + --shadows:0 2px 2px 0 #00000012; + + /*Tags*/ + --tags-bg: #f9f4f4; + --tags-font: #958484; + + /*Codemirror*/ + --codemirror-bg: white; + --codemirror-text: #454545; + --codemirror-numbeslines: #897067; + --codemirror-numbes-bg: #343232; + + /*Menu*/ + --open-menu: #e1d6d2; + --menu-menu-open-prop: var(--buttons-open); + --save-menu: #008203; + + --menu-input-bg: var(--w-1); + --menu-input-border: var(--bg-3); + + --menu-item-bg-hover-open: var(--windows); + + --menu-item-a: var(--link); + --menu-item-a-hover: var(--link-hover); + --menu-item-a-none-link: var(--link-none); + + --menu-item-open-prop: var(--buttons-open); + + --menu-menu-buttons-div: var(--buttons-font); + --menu-menu-buttons-div-hover: var(--buttons-hover); + + --menu-input-select-font-disabled: #746c6a; + + --menu-item-select-dropdown-font: #333333; + --menu-item-field-search-input-bg: var(--bg-4); + --menu-item-field-search-input-focus: #786050; + --menu-item-list-search-li-hover-active: var(--bg-4); + + --sub-line: #0000ee; + + + /*Modules*/ + --modules-grid-div-disabled: #f3f3f3; + --modules-grid-div-disabled-hover: #f3f3f3; + --disabled-module: #a39595; + --disabled-module-description: #a39595; + --disabled-module-sw-btn: #009468; + --shadow: #00000030; + --blur-bg: #ffffff00; + --blur-font: #1c1313; + + /*Individual*/ + --category-parents: #918383; + + /*Icons*/ + --search-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 489.68 489.68'%3E%3Cdefs%3E%3Cstyle%3E.a-search%7Bfill:%239b8b84;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a-search' d='M0,196.4C0,304.9,88,392.83,196.5,392.8A196.53,196.53,0,0,0,320.1,349l135,135A20.44,20.44,0,0,0,484,455.1l-135-135c68.29-84.31,55.3-208-29-276.3A196.42,196.42,0,0,0,196.4,0C88,0,0,87.9,0,196.4Zm40.8,0A155.6,155.6,0,1,1,196.4,352h0A155.66,155.66,0,0,1,40.8,196.4Z'/%3E%3C/svg%3E"); + + --select-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23b9a097' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"); + + --pages-pin-off: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16.46'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bfill:none;stroke:%23ff8562;stroke-miterlimit:10;stroke-width:2px;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='a' points='1 0 1 14.72 7 11.22 13 14.72 13 0 1 0'/%3E%3Cpolyline class='b' points='1 0 1 14.72 7 11.22 13 14.72 13 0'/%3E%3C/svg%3E"); + + --pages-pin-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16.46'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:%23ff8562;%7D%3C/style%3E%3C/defs%3E%3Cpolygon class='a' points='14 16.46 7 12.38 0 16.46 0 0 14 0 14 16.46'/%3E%3C/svg%3E"); + + --check-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); + + --eye-on: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 111 111'%3E%3Cdefs%3E%3Cstyle%3E.a,.c%7Bfill:none;%7D.b%7Bfill:%239b8b84;%7D.c%7Bstroke:%239b8b84;stroke-miterlimit:10;stroke-width:7px;%7D%3C/style%3E%3C/defs%3E%3Crect class='a' width='111' height='111'/%3E%3Cpath class='b' d='M55.61,93A57.36,57.36,0,0,1,2,56.45l-.5-1.28L2,53.88A57.36,57.36,0,0,1,55.61,17.37h0a57.36,57.36,0,0,1,53.65,36.51l.49,1.27-.48,1.27C101,77.94,79,93,55.61,93ZM9,55.17A50.39,50.39,0,0,0,55.61,86c20.06,0,39-12.6,46.61-30.8A50.37,50.37,0,0,0,55.61,24.37h0A50.37,50.37,0,0,0,9,55.17Z' transform='translate(-0.11)'/%3E%3Cpath class='b' d='M55.61,80.17a25,25,0,1,1,25-25A25,25,0,0,1,55.61,80.17Zm0-41.55A16.55,16.55,0,1,0,72.16,55.17,16.57,16.57,0,0,0,55.61,38.62Z' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M103.77,88.28' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M19.55,7.34' transform='translate(-0.11)'/%3E%3C/svg%3E"); + + --eye-off: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 111 111'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;%7D.b%7Bstroke:%239b8b84;stroke-miterlimit:10;stroke-width:7px;%7D.c%7Bfill:%239b8b84;%7D%3C/style%3E%3C/defs%3E%3Crect class='a' width='111' height='111'/%3E%3Cpath class='b' d='M103.77,88.28' transform='translate(-0.11)'/%3E%3Cpath class='b' d='M19.55,7.34' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M78.12,66A25,25,0,0,0,44.75,32.66l6.55,6.55A16.49,16.49,0,0,1,71.57,59.48Z' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M109.26,53.88A57.36,57.36,0,0,0,55.61,17.37h0a58.11,58.11,0,0,0-21.89,4.26l5.44,5.44a51.16,51.16,0,0,1,16.45-2.7,50.37,50.37,0,0,1,46.61,30.81A49.46,49.46,0,0,1,87,74.93l5,5a56.18,56.18,0,0,0,17.29-23.47l.48-1.27Z' transform='translate(-0.11)'/%3E%3Cpath class='c' d='M86.21,84l-5.08-5.08h0l-7-7-6-6L44.83,42.64l-6-6L32.22,30h0l-5.16-5.17h0L12.17,10,7.22,14.93,21.07,28.78A57.62,57.62,0,0,0,2,53.88l-.5,1.29L2,56.45A57.36,57.36,0,0,0,55.61,93,57,57,0,0,0,79.79,87.5L97,104.67l5-5L86.2,84ZM62.5,70.21a16.37,16.37,0,0,1-6.89,1.51A16.56,16.56,0,0,1,39.06,55.17a16.3,16.3,0,0,1,1.52-6.88ZM55.61,86A50.39,50.39,0,0,1,9,55.17,50.55,50.55,0,0,1,26.09,33.8l8.26,8.26a24.73,24.73,0,0,0-3.74,13.11A25,25,0,0,0,68.73,76.44l5.76,5.76A49.74,49.74,0,0,1,55.61,86Z' transform='translate(-0.11)'/%3E%3C/svg%3E"); + + --inter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.5 31.5'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;%7D.a%7Bstroke:%23d09074;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M404.15,357.31l6-6-6-6' transform='translate(-386.5 -335.5)'/%3E%3Cline class='a' x1='7.75' y1='15.75' x2='22.75' y2='15.75'/%3E%3Ccircle class='a' cx='15.75' cy='15.75' r='14'/%3E%3Crect class='b' width='31.5' height='31.5'/%3E%3C/svg%3E"); + + --icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 37.47 37.61'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;stroke:%239b8b84;stroke-linecap:round;stroke-width:5px;%7D.b%7Bstroke-linejoin:round;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M4.17,18.91H35.22' transform='translate(-0.25 -0.1)'/%3E%3Cpolyline class='b' points='18.81 35.12 2.5 18.81 18.81 2.5'/%3E%3C/svg%3E"); + + --icon-sub-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 39.97 37.62'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;stroke:%239b8b84;stroke-linecap:round;stroke-linejoin:round;stroke-width:5px;%7D%3C/style%3E%3C/defs%3E%3Cpolyline class='a' points='18.81 35.13 2.5 18.82 18.81 2.5'/%3E%3Cpolyline class='a' points='37.47 35.12 21.16 18.81 37.47 2.5'/%3E%3C/svg%3E"); + + --icon-link: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36.86 18.94'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;stroke:%239b8b84;stroke-linecap:round;stroke-width:3px;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M22.06,10.83H27.7a8,8,0,0,1,8,8h0a8,8,0,0,1-8,8H22.06' transform='translate(-0.3 -9.33)'/%3E%3Cpath class='a' d='M15.41,26.78H9.77a8,8,0,0,1-8-8h0a8,8,0,0,1,8-8h5.64' transform='translate(-0.3 -9.33)'/%3E%3Cline class='a' x1='8.31' y1='9.47' x2='28.56' y2='9.47'/%3E%3C/svg%3E"); + + --icon-clear: url("data:image/svg+xml,%0A%3Csvg version='1.1' viewBox='0 0 37.819 37.819' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.a-clear%7Bfill:none;stroke-linecap:round;stroke-width:5;stroke:%239b8b84%7D%3C/style%3E%3Cg transform='translate(-32.072 -86.124)'%3E%3Cpath class='a-clear' d='m32.34 86.392 37.284 37.284'/%3E%3Cpath class='a-clear' d='m69.624 86.392-37.284 37.284'/%3E%3C/g%3E%3C/svg%3E"); + + --icon-clear-wb: url("data:image/svg+xml,%0A%3Csvg version='1.1' viewBox='0 0 37.819 37.819' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E.a-clear%7Bfill:none;stroke-linecap:round;stroke-width:5;stroke:%23ffffff%7D%3C/style%3E%3Cg transform='translate(-32.072 -86.124)'%3E%3Cpath class='a-clear' d='m32.34 86.392 37.284 37.284'/%3E%3Cpath class='a-clear' d='m69.624 86.392-37.284 37.284'/%3E%3C/g%3E%3C/svg%3E"); + + --icon-save: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 769.83 769.83'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;stroke:%239b8b84;stroke-miterlimit:10;stroke-width:55px;%7D%3C/style%3E%3C/defs%3E%3Ccircle class='a' cx='384.91' cy='384.91' r='102.48'/%3E%3Cpath class='a' d='M750.91,258.62V687.83a63.08,63.08,0,0,1-63.08,63.08H89.17a63.08,63.08,0,0,1-63.08-63.08h0V89.17A63.08,63.08,0,0,1,89.17,26.09H518.38A98.74,98.74,0,0,1,588.17,55L722,188.83A98.74,98.74,0,0,1,750.91,258.62Z' transform='translate(-3.59 -3.59)'/%3E%3Cpath class='a' d='M464.15,26.09V129.44A46.11,46.11,0,0,1,418,175.55H187.48a46.11,46.11,0,0,1-46.11-46.11V26.09' transform='translate(-3.59 -3.59)'/%3E%3C/svg%3E"); + + --icon-trash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35 35'%3E%3Cdefs%3E%3Cstyle%3E.a,.b%7Bfill:none;%7D.a%7Bstroke:%239b8b84;stroke-miterlimit:10;stroke-width:1.7px;%7D%3C/style%3E%3C/defs%3E%3Cline class='a' x1='9.63' y1='12.04' x2='25.38' y2='12.04'/%3E%3Cline class='a' x1='15.14' y1='8.75' x2='19.86' y2='8.75'/%3E%3Cpath class='a' d='M23.87,14.77v8.84a2.68,2.68,0,0,1-2.68,2.64H13.82a2.68,2.68,0,0,1-2.64-2.64V14.77'/%3E%3Cline class='a' x1='15.33' y1='15.89' x2='15.33' y2='21.96'/%3E%3Cline class='a' x1='19.69' y1='15.89' x2='19.69' y2='21.96'/%3E%3Crect class='b' width='35' height='35'/%3E%3C/svg%3E"); + + --noise: url(../img/noise-light.png); +} +/*#endregion Colors Light*/ + + + +*, *::before, *::after { + box-sizing: border-box; + padding: 0; + margin: 0; +} + +@media (max-width: 1024px) { + .classic * { + -webkit-tap-highlight-color: transparent; + } +} + +input, textarea { + font-family: var(--sans-serif); +} +input[type="date"], input[type="time"] { + font-family: revert; +} + +:active, :hover, :focus { + outline: none; /* firefox fix */ +} + +html { + height: 100%; + overflow: hidden; /* disable swipe */ +} + +body { + display: grid; + height: 100%; + font-family: var(--sans-serif); + font-size: 1.04rem; + background-color: var(--bg-3); + background-image: var(--noise); +} +@media (max-width: 1023px) { + body { + grid-template-rows: 3rem 1fr; + grid-template-areas: + "header" + "main"; + } +} +@media (min-width: 1024px) { + body { + grid-template-rows: 1.9rem 1fr; + } + body.login { + grid-template-areas: + "header" + "main"; + } + body.logged { + grid-template-columns: 14rem 1fr; + grid-template-areas: + "aside header" + "aside main"; + } +} + +header { + grid-area: header; + display: grid; + z-index: 777; +} + +@media (max-width: 1023px) { + body.logged header { + grid-template-columns: 3rem 1fr; + gap: 0.3rem; + } + body.mobile-menu-open header { + background-color: var(--bg-3); + } +} + + +@media (max-width: 1023px) { + header .burger { + display: flex; + justify-content: center; + align-items: center; + position: relative; + } + + .menu-icon { + width: 1.7rem; + height: 0.75rem; + position: relative; + z-index:7; + } + .menu-icon span { + display: block; + position: absolute; + left: 0; + width: 100%; + height: 0.13rem; + transform: rotate(0); + transition: transform 0.1s ease; + background-color: var(--menu-icon-span); + } + .menu-icon span.line-1 { + top: 0; + } + .menu-icon span.line-2 { + bottom: 0; + } + .mobile-menu-open .menu-icon span.line-1 { + top: 5px; + transform: rotate(45deg); + } + .mobile-menu-open .menu-icon span.line-2 { + top: 5px; + transform: rotate(-45deg); + } +} +@media (min-width: 1024px) { + header .burger { + display: none; + } +} + +header .menu { + display: flex; + justify-content: right; +} + +header .menu > * { + display: flex; + align-items: center; + height: 100%; + cursor: pointer; + text-decoration: none; + user-select: none; + padding: 0 0.7rem 0 0.7rem; + color: var(--link); +} + +@media (max-width: 1023px) { + header .menu > *:active { + color: var(--header-menu-hover); + } +} +@media (min-width: 1024px) { + header .menu > *:hover { + color: var(--header-menu-hover); + } +} + +/* Auth. Start */ +.setup-auth { + text-align: center; + padding: 5px; + font-size: 1rem; +} +.setup-error { + display: flex; + align-items: center; + text-align: center; + padding: 5px; + font-size: 0.9rem; + min-height: 4rem; + color: red; +} + +.aside-main { + grid-area: main; + display: grid; + grid-template-areas: ". center-box ."; + grid-template-columns: 1fr minmax(auto,19rem) 1fr; + overflow-y: auto; +} +.center-box { + display: grid; + grid-template-rows:auto auto auto auto 1fr auto; + grid-area: center-box; + gap: 1rem; +} + +/* Select */ +.lang-selector { + padding: 0.5rem; + box-shadow: 0 2px 3px 0 #00000033; + border-radius: 0.3rem; + background-color: var(--bg-4); +} + +.login .lang-select-grid { + text-align: left; + position: relative; + user-select: none; + cursor: pointer; + -webkit-tap-highlight-color: transparent; /* Del blue click in Chrome Mobile */ +} +.login .field-select { + display: grid; + grid-template-columns: 1fr 26px; + background-color: var(--bg-3); + border-radius: 0.2rem; + line-height: 2; + height: 100%; +} +.login .field-select .value { + line-height: 2; + font-size: 0.875rem; + color: var(--windows-font); + padding: 0 0.54rem; +} +.login .field-select .icon { + background-repeat: no-repeat; + background-position: center; + background-size: 12px; + background-image: var(--select-icon); +} + + +.login .lang-select-grid .field-options { + display: grid; + position: absolute; + height: 0; + overflow: hidden; + width: 100%; + border-radius: 0.25rem; + box-shadow: 0 2px 3px 0 #00000033; + max-height: 17rem; + z-index: 777; +} +.login .lang-select-grid .field-options.open { + background-color: var(--bg-3); + border: 2px solid var(--bg-4); + color: var(--text); + overflow: auto; + height: auto; +} +.login .lang-select-grid .field-options .option { + padding: 0.4rem 0.44rem; + cursor: pointer; + font-size: 0.9rem; +} +.login .lang-select-grid .field-options .option:hover { + background-color: var(--bg-2); +} + + +.setup-auth { + display: flex; + justify-content: center; + font-size: 0.9rem; + color: var(--setup-auth); +} + +.login-and-password { + display: grid; + gap: 2px; + padding: 10px 10px 10px 10px; + background-color: var(--bg-4); + box-shadow: 0 2px 3px 0 #00000033; + border-radius: 0.25rem; +} +.login-and-password .login { + position: relative; +} +.login-and-password .password { + display: grid; + grid-template-columns: 1fr auto auto; + gap: 5px; + position: relative; +} +.login-and-password .login input, .login-and-password .password input { + width: 100%; + background-color: var(--bg-3); + border: none; + font-size: 1rem; + color: var(--windows-font); + font-family: var(--monospace); + line-height: 2; + min-height: 34px; + position: relative; +} + +.login-and-password .login input { + height: 34px; + border-radius: 0.25rem 0.25rem 0 0; + padding: 0 8px 0 8px; +} +.login-and-password .password input { + grid-row: 1/2; + grid-column: 1/-1; + height: 34px; + padding: 0 85px 0 8px; + border-radius: 0 0 0.25rem 0.25rem; +} +.login-and-password .login input:autofill, .login-and-password .password input:autofill { + background-image: none; +} + + +.login-and-password .password-eye { + grid-row: 1/2; + grid-column: 2/3; + height: 33px; + width: 33px; + cursor: pointer; + background-size: 20px; + background-position: center; + background-repeat: no-repeat; + background-image: var(--eye-off); + z-index: 1; +} +.login-and-password .password-eye.showed { + background-image: var(--eye-on); +} + +.login-and-password .password button { + grid-row: 1/2; + grid-column: 3/4; + cursor: pointer; + height: 33px; + width: 33px; + min-height: unset; + z-index: 7; + border: transparent; + background-color: transparent; + background-size: 22px; + background-position: center center; + background-repeat: no-repeat; + background-image: var(--inter-icon); +} + +.support-box { + display: flex; + justify-content: center; + padding-bottom: 2rem; +} +.support-box a { + font-size: 0.9rem; + padding: 0.2rem 0.8rem 0.3rem 0.8rem; + color: var(--windows-font); + text-decoration: none; +} +/* Auth. End */ + +aside { + overflow-y: auto; + scrollbar-width: none; /* FireFox */ +} +@media (max-width: 1023px) { + aside { + position: fixed; + width: 14rem; + min-height: 100%; + left: 0; + top: 0; + bottom: 0; + transform: translate3d(-270px, 0, 0); + transition: transform 0.25s ease; + z-index: 700; + padding: 3rem 0 3rem 0; + background-color: var(--bg-3); + background-image: var(--noise); + } + + .mobile-menu-open aside { + transform: translate3d(0, 0, 0); + } +} +@media (min-width: 1024px) { + aside { + grid-area: aside; + padding: 1.9rem 0 1.9rem 0; + } +} + +aside::-webkit-scrollbar { + width: 0; +} + + +aside section { + padding:9px 0 10px 0; +} +aside section div { + padding: 5px 5px 5px 20px; + font-size: 0.94rem; + color: var(--aside-section-div); +} +aside section a { + padding: 5px 5px 5px 36px; + text-decoration: none; + display: block; + font-size: 0.94rem; + color: var(--aside-section-a); +} +@media (min-width: 1024px) { + aside section a { + border-radius: 0 0.3rem 0.3rem 0; + } +} +aside section a:hover { + background-color: var(--aside-section-a-hover); +} +aside section a.active { + background-color: var(--aside-section-a-active); +} +aside section a.red { + background-color: var(--aside-section-a-red); + +} + +main { + grid-area: main; + overflow: hidden; +} + +body > main > section:not(:target) { + display: none !important; +} + +/* Start Secion */ +#start { + overflow-y: auto; + max-height: 100%; +} +@media (max-width: 1023px) { + #start { + padding: 1rem 0.4rem 1rem 0.4rem; + } +} +@media (min-width: 1024px) { + #start { + padding: 1rem; + } +} +#start > div { + display: grid; + gap: 1rem; + box-shadow: 0 2px 3px 0 #00000033; + border-radius: 0.3rem; + background-color: var(--windows); +} +@media (max-width: 1023px) { + #start > div { + padding: 1rem 0.7rem 1.4rem 0.7rem; + } +} +@media (min-width: 1024px) { + #start > div { + padding: 1rem; + } +} +#start div > div { + color: var(--windows-font); +} +#start div > p { + color: var(--text); +} +#start div > p a { + color: var(--link); +} +/* End */ + +/* Auth Start */ +#auth { + display: grid; + height: 100%; + overflow-y: auto; + row-gap: 1rem; + grid-auto-rows: max-content; +} +@media (max-width: 1023px) { + #auth { + padding: 1rem 0.4rem 1rem 0.4rem; + } +} +@media (min-width: 1024px) { + #auth { + padding: 1rem; + } +} +#auth form { + display: grid; + background-color: var(--windows); + background-image: var(--noise); + border-radius: 0.3rem; + box-shadow: var(--shadows); +} +@media (max-width: 1370px) { + #auth form { + row-gap: 10px; + padding: 1rem 0.7rem 1.4rem 0.7rem; + } +} +@media (min-width: 1371px) { + #auth form { + grid-auto-columns: max-content; + grid-auto-flow: column; + grid-column-gap: 1rem; + justify-content: center; + padding: 1rem; + } +} + +#auth form > div { + position: relative; +} +#auth form .password-widget { + display: grid; + grid-template-columns: 1fr auto; + gap: 5px; +} + +#auth form input { + border-radius: 4px; + font-size: 0.875rem; + font-family: var(--monospace); + padding: 0 0.54rem; + min-height: 35px; + width: 100%; + color: var(--input-font); + background-color: var(--input-bg); + border: 2px solid var(--input-border); +} +html:not(.classic) #auth form input[name="admin_password"] { + padding-right: 2.2rem; + grid-column: 1 / -1; + grid-row: 1 / 2; + } + +#auth input[type="submit"] { + cursor: pointer; +} + + +#auth form .admin-url, #auth form .login-title, #auth form .passwd-title { + color: var(--windows-font); +} +@media (min-width: 1024px) { + #auth form .admin-url, #auth form .login-title, #auth form .passwd-title { + display: grid; + align-items: center; + padding-bottom: 3px; + } +} + +#auth form .password-eye { + grid-column: 2 / 3; + grid-row: 1 / 2; + width: 34px; + height: 34px; + cursor: pointer; + background-size: 20px; + background-position: center; + background-repeat: no-repeat; + background-image: var(--eye-off); +} +#auth form .password-eye.showed { + background-image: var(--eye-on); +} +@media (max-width: 1023px) { + .current-sess { + padding: 1rem 0 1rem 0; + } + .history-sess { + padding: 1rem 0 1rem 0; + } +} +#auth .table-title { + padding: 0 0.5rem 0.5rem 0.7rem; + color: var(--windows-font); +} +.sess-table { + display: grid; + gap: 5px; +} +.sess-table > div { + color: var(--sess-table-font); + background-color: var(--windows); + background-image: var(--noise); + border-radius: 0.3rem; +} +@media (max-width: 1023px) { + .sess-table > div { + display: block; + padding: 0.4rem 0.3125rem 0.5rem 0.7rem; + } +} +@media (min-width: 1024px) { + .sess-table > div { + display: grid; + grid-auto-flow: column; + column-gap: 3px; + grid-template-columns: 2rem 10rem 8rem auto; + padding: 0.3125rem; + } +} +.sess-table .current { + color: var(--sess-table-current); +} +#auth .del-sess { + width: 1.6rem; + height: 1.6rem; + justify-self: center; + cursor: pointer; + border-radius: 4px; + float: right; + background-repeat: no-repeat; + background-position: center center; + background-size: 44%; + background-image: var(--icon-clear); +} +#auth .del-sess:hover { + background-color: var(--auth-del-sess-hover); +} +.sess-table > div > div { + padding: 2px; + font-size: 0.875rem; +} +/* End */ + +/* PHP Info Start */ +#phpinfo {color: var(--phpinfo-font); font-family: var(--sans-serif); overflow-y: scroll; height: 100%; padding: 1rem;} +@media (max-width: 1023px) { + #phpinfo {padding: 0 0.4rem 0.4rem 0.4rem;} + #phpinfo .e {word-break: break-word; min-width: 100px; max-width: 33%;} + #phpinfo .h {word-break: break-word;} + #phpinfo .v {word-break: break-word;} +} +@media (min-width: 1024px) { + #phpinfo .e {min-width: 200px;width: 33%;} + #phpinfo .v {word-break: break-word;} +} +#phpinfo td a img { display: none; } +#phpinfo pre {margin: 0; font-family: monospace;} +#phpinfo table {border-collapse: collapse; border: 0; width: 100%;} +#phpinfo .center {text-align: center;} +@media (min-width: 1024px) {#phpinfo .center table:first-child {margin-top: 0;}} +#phpinfo .center table {margin: 1rem auto; text-align: left;} +#phpinfo td, th {border: 1px solid var(--bg-4); font-size: 75%; vertical-align: baseline; padding: 4px 5px;} +#phpinfo th {position: sticky; top: 0; background-color: inherit;} +#phpinfo h1 {font-size: 150%;} +#phpinfo h2 {font-size: 125%;} +#phpinfo .p {text-align: left; margin: 0;} +#phpinfo .e {background-color: var(--bg-3); font-weight: bold; } +#phpinfo .h {background-color: var(--phpinfo-h-bg); font-weight: bold; } +#phpinfo .v {background-color: var(--bg-3); overflow-x: auto; } +#phpinfo .v i {color: var(--phpinfo-v-i-font);} +#phpinfo img {float: right; border: 0;} +#phpinfo hr {width: 100%; background-color: var(--phpinfo-hr-bg); border: 0; height: 1px;} +#phpinfo th { border-color: transparent;} +#phpinfo tr:hover td {background-color: var(--bg-2);} +/* End */ + + +/* Modules */ +#modules { + display: grid; + height: 100%; + overflow-y: auto; + grid-auto-rows: max-content; + row-gap: 1rem; +} + +@media (max-width: 1023px) { + #modules { + padding: 1rem 0.4rem 1rem 0.4rem; + display: flex; /*Samsung Browser - padding-bottom*/ + flex-direction: column; /*Samsung Browser - padding-bottom*/ + } + +} +@media (min-width: 1024px) { + #modules { + padding: 1rem; + } +} + +#modules > div { + display: grid; + row-gap: 0.5rem; +} + +#modules .upload_dnd { + height: 40px; + position: relative; + margin-top: 0.5rem; + padding: 9px 11px 5px 11px; + border-radius: 0.3rem; + color: var(--windows-font); + background-color: var(--bg-4); + white-space: nowrap; + width: max-content; + font-size: 0.9rem; + user-select: none; +} +#modules .upload_dnd #module-upload { + width: 100%; + height: 100%; + left: 0; + right: 0; + top: 0; + bottom: 0; + opacity: 0; + overflow: hidden; + position: absolute; + z-index: 7; + cursor: pointer; +} + +label[for=module-upload] { + display: block; + white-space: nowrap; + width: max-content; + font-size: 0.9rem; + user-select: none; +} + +input[type="file" i]::-webkit-file-upload-button { + cursor: pointer; +} + +#modules .modules-grid > div { + display: grid; + grid-template-areas: + "module-name module-version" + "module-description module-description" + "module-sw-btn module-del-btn"; + grid-template-columns: 1fr auto; + overflow: hidden; + border-radius: 0.3rem; + padding: 0.7rem; + column-gap: 0.7rem; + box-shadow: var(--shadows); + row-gap: 0.1rem; + background-image: var(--noise); +} + +#modules .modules-grid > div.enabled { + background-color: var(--windows); +} +@media (min-width: 1024px) { + #modules .modules-grid > div.enabled:hover { + background-color: var(--windows-hover); + } +} + +#modules .modules-grid > div.disabled { + background-color: var(--modules-grid-div-disabled); +} +@media (min-width: 1024px) { + #modules .modules-grid > div.disabled:hover { + background-color: var(--modules-grid-div-disabled-hover); + } +} + +#modules .module-name { + grid-area: module-name; + margin-top: -5px; + font-size: 1rem; + font-weight: 600; +} +#modules .enabled .module-name { + color: var(--windows-font); +} +#modules .disabled .module-name { + color: var(--disabled-module); +} + +#modules .module-version { + grid-area: module-version; + margin-top: -5px; + font-size: 1rem; + color: var(--text); +} +#modules .module-description { + grid-area: module-description; + font-size: 0.9rem; +} +#modules .enabled .module-description { + color: var(--enabled-module-description); +} +#modules .enabled .module-description a { + color: var(--link); + text-decoration: none; +} +#modules .disabled .module-description { + color: var(--disabled-module); +} + +#modules .module-del-btn { + grid-area: module-del-btn; + font-size: 0.9rem; + color: var(--link); + cursor: pointer; + text-align: right; + user-select: none; +} + +#modules .module-sw-btn { + grid-area: module-sw-btn; + width: max-content; + font-size: 0.9rem; + user-select: none; + cursor: pointer; +} +#modules .enabled .module-sw-btn { + color: var(--link); +} +#modules .disabled .module-sw-btn { + color: var(--disabled-module-sw-btn); +} +/* End */ + + + +/* Admin Menu */ +#admin_menu { + display: grid; + height: 100%; + overflow-y: auto; + grid-auto-rows: max-content; +} + +#admin_menu .main-main { + display: grid; + gap: 1rem; +} +@media (max-width: 1023px) { + #admin_menu .main-main { + padding: 1rem 0.7rem 0.3rem 0.7rem; + } +} +@media (min-width: 1024px) { + #admin_menu .main-main { + padding: 1rem 1rem 0.3rem 1rem; + } +} + + +@media (max-width: 1023px) { + #admin_menu .main-footer { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #admin_menu .main-footer { + padding: 1rem; + } +} + + + +#admin_menu [data-am-type="section"] { + display: grid; + grid-template-areas: + "title sort" + "buttons buttons"; + grid-template-columns: 1fr auto; + column-gap: 1rem; + row-gap: 0.7rem; + background-color: var(--windows); + background-image: var(--noise); + border-radius: 0.3rem; + position: relative; + min-height: 4rem; + overflow: hidden; + padding: 0.7rem; +} + +#admin_menu [data-am-type="section"].hidden::before { + content: ""; + position: absolute; + right: 2px; + bottom: 2px; + z-index: 1; + width: 7px; + height: 7px; + border-radius: 50%; + background-color: var(--orange); +} + +#admin_menu .items-grid { + display: grid; + row-gap: 0.3rem; + padding: 0.8rem 0 0.5rem 0.5rem; + margin-top: -5px; + background-color: var(--windows); + border-radius: 0 0 0.3rem 0.3rem; +} + +#admin_menu [data-am-type="section"] input[name=title] { + grid-area: title; + width: 100%; + background-color: var(--menu-input-bg); + border: 2px solid var(--menu-input-border); +} + +#admin_menu [data-am-type="section"] input[name=sort] { + grid-area: sort; + width: 4rem; + justify-self: right; + text-align: center; + background-color: var(--menu-input-bg); + border: 2px solid var(--menu-input-border); +} +#admin_menu input { + border-radius: 4px; + min-height: 30px; + height: 100%; + background-color: var(--bg-4); + border: 1px solid var(--bg-4); + color: var(--text); +} +#admin_menu input { + padding: 0 0.54rem; + font-size: 0.94rem; +} + + +#admin_menu .section-select-grid { + grid-area: select; + position: relative; +} +#admin_menu .field-select { + display: grid; + grid-template-columns: 1fr 28px; + height: 100%; + min-height: 30px; + cursor: pointer; + background-color: var(--bg-4); + border: 1px solid var(--bg-4); + border-radius: 4px; + user-select: none; +} +#admin_menu .field-select > .value { + padding: 0 0.1rem 0 0.54rem; + white-space: nowrap; + overflow: hidden; + line-height: 26px; + font-size: 0.9rem; + color: var(--text); +} +#admin_menu .field-select > .icon { + background-image: var(--select-icon); + background-repeat: no-repeat; + background-position: center; + background-size: 12px; +} + +#admin_menu .field-options { + display: grid; + position: absolute; + height: 0; + overflow: hidden; + width: 100%; + border-radius: 0.25rem; + box-shadow: 0 2px 3px 0 #00000033; + max-height: 17rem; + z-index: 777; +} +#admin_menu .field-options.open { + background-color: var(--bg-3); + border: 2px solid var(--bg-4); + color: var(--text); + overflow: auto; + height: auto; + min-width: max-content; + margin-top: 2px; +} +#admin_menu .field-options .option { + padding: 0.4rem 0.44rem; + cursor: pointer; + font-size: 0.9rem; +} +#admin_menu .field-options .option:hover { + background-color: var(--bg-2); +} + + + + + +#admin_menu .am-grid { + display: grid; + row-gap: 1rem; +} + +#admin_menu .am-grid > div { + box-shadow: 0 0 3px 0 #00000096; + border-radius: 0.3rem; +} + +#admin_menu .main-footer { + grid-auto-flow: column; + display: grid; + justify-content: start; + grid-column-gap: 1rem; +} + +#admin_menu .add-section, #admin_menu .reset-all { + display: block; + width: max-content; + padding: 0.4rem 0.7rem 0.5rem 0.7rem; + background-color: var(--bg-4); + text-decoration: none; + font-size: 0.9rem; + color: var(--windows-font); + border-radius: 0.3rem; + user-select: none; + cursor: pointer; +} + + +#admin_menu [data-am-type="item"] { + display: grid; + grid-template-areas: + "item-name select sort" + "buttons buttons buttons"; + grid-template-columns: 1fr auto auto; + column-gap: 1rem; + row-gap: 0.7rem; + background-color: var(--bg-3); + background-image: var(--noise); + border-radius: 0.3rem 0 0 0.3rem; + position: relative; + min-height: 4rem; + padding: 0.7rem; +} +#admin_menu [data-am-type="item"]:hover { + background-color: var(--open-menu); +} +#admin_menu [data-am-type="item"].hidden::before { + content: ""; + position: absolute; + right: 2px; + bottom: 2px; + z-index: 1; + width: 7px; + height: 7px; + border-radius: 50%; + background-color: var(--orange); +} + +#admin_menu .item-name { + grid-area: item-name; + font-size: 1rem; + align-self: center; + margin-top: -5px; + color: var(--aside-section-a); + white-space: pre; + overflow: hidden; + text-overflow: ellipsis; +} +#admin_menu [data-am-type="item"].hidden .item-name { + opacity: 0.3; + user-select: none; +} + +#admin_menu select { + grid-area: select; +} +#admin_menu [data-am-type] .buttons { + grid-area: buttons; + display: grid; + grid-template-columns: auto auto auto; + justify-content: right; + column-gap: 1rem; + font-size: 0.9rem; +} +#admin_menu [data-am-type] .buttons > a { + cursor: pointer; + color: var(--buttons-font); + user-select: none; +} +#admin_menu [data-am-type] .buttons > a:hover { + color: var(--buttons-hover); +} + +#admin_menu input[name="sort"] { + width: 4rem; + text-align: center; +} +/* End */ + + + +@media (max-width: 1023px) { + .mobile-menu-open .milk { + display: block; + position: fixed; + left: 0; + right: 0; + top: 0; + bottom: 0; + opacity: 0.7; + z-index: 10; + background-color: var(--mobile-menu-open-milk); + } +} + +/* Service Messages */ +.log-info-box { + position: fixed; + z-index: 770; + display: inline-grid; +} +@media (max-width: 1023px) { + .log-info-box { + top: 3rem; + right: 0.3rem; + } +} +@media (min-width: 1024px) { + .log-info-box { + top: 2.5rem; + right: 0.3rem; + } +} + +.log-info-box > div { + padding: 15px; + font-size: 0.875rem; + margin-bottom: 10px; + border-radius: 5px; + justify-self: right; +} + +.info-success { + background-color: var(--info-success); + color: var(--info-fonts-success); + box-shadow: 0 2px 3px 0 rgba(0,0,0,0.2); +} +.info-success a { + color: var(--info-fonts-success); +} + +.info-error { + background-color: var(--info-error); + color: var(--info-fonts-error); + box-shadow: 0 2px 3px 0 #00000033; +} +.info-error a { + color: var(--info-fonts-error); +} +.log-info-box > .timeout { + overflow: hidden; + height: 0 !important; + transition: height 0.5s, opacity 0.2s, padding 0.5s, margin 0.5s; + opacity: 0; + padding-top: 0; + padding-bottom: 0; + margin-bottom: 0; +} + + +/* Checks */ +input[type="checkbox"] { + width: 1.4rem; + height: 1.4rem; + border-radius: 0.25rem; + background-repeat: no-repeat; + background-position: center; + background-size: contain; + appearance: none; + border: 2px solid; + background-color: var(--bg-3); + border-color: var(--bg-4); + cursor: pointer; +} +input[type="checkbox"]:checked { + background-color: var(--orange); + border-color: var(--orange); + box-shadow: 0 0 0 0.25rem var(--focus-orange); + background-image: var(--check-icon); +} + +@-moz-document url-prefix() +{ + .enable-cache { + transform: translateY(-1px); + } +} + +/* Buttons */ +button { + display: flex; + justify-content: center; + min-height: 35px; + padding: 5px 12px 0 12px; + border-radius: 0.25rem; + background-color: var(--button-bg); + border: 1px solid var(--button-border); + color: var(--windows-font); + font-family: var(--sans-serif); + font-size: 1rem; + user-select: none; + cursor: pointer; +} + +.CodeMirror-dialog button { + display: grid; + min-height: auto; + margin: 4px 0; + padding: 2px 10px 3px 10px; +} +.CodeMirror-search-label { + align-self: center; +} +.CodeMirror-dialog-top { + display: grid; + grid-auto-flow: column; + justify-content: left; + gap: 7px; +} +.CodeMirror-dialog button { + display: grid; + background-color: var(--bg-3); +} + + +.CodeMirror-dialog button:active { + margin: 4px 0; + padding: 2px 10px 2px 10px; +} +.classic .CodeMirror-dialog button { + height: 24px; + padding: 2px 10px 0 10px; + margin: 2px 0; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #4c4949; + border-left: 1px solid #4c4949; + outline: 1px solid #131313; + outline-offset: 0px; +} +.classic .CodeMirror-dialog button:active { + height: 24px; + padding: 4px 10px 0 10px; + margin: 2px 0; + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; +} + + +/* Menu */ +.classic aside section a { + padding: 3px 5px 3px 36px; + border-color: transparent; + border-style: solid; + border-left-width: 0; + border-right-width: 2px; + border-top-width: 2px; + border-bottom-width: 2px; + border-radius: 0; +} +.classic aside section a:hover { + border-color: #393737; +} +.classic section a.active { + border-color: #393737; + background-color: var(--bg-2); +} +.classic section a.red { + border-color: red; +} +.classic section a.red:hover { + border-color: red; +} + +/* Messages Info */ +.classic .log-info-box > div { + border-width: 2px; + border-color: #999999; + border-style: solid; + border-radius: 0; +} +.classic .log-info-box .timeout { + border-width: 0; +} +.classic .info-success { + background-color: #292827ed; + color: #ffffff; + box-shadow: 4px 5px 0px 0 #00000077; +} +.classic .info-error { + box-shadow: 4px 5px 0px 0 #00000077; +} + +/* Update */ +#modules .dev-window.developers_only { + display: none; +} +#modules > div { + background-image: var(--noise); +} + + +#modules .update-window { + display: grid; + grid-auto-rows: max-content; + row-gap: 0.7rem; + box-shadow: var(--shadows); + border-radius: 0.3rem; + background-color: var(--windows); +} +#modules .update-window div p { + font-size: 1rem; + color: var(--text); +} +#modules .update-window div p:last-child { + margin-bottom: 0.5rem; +} +#modules .update-window > div:first-child, #modules .dev-window > div:first-child { + color: var(--windows-font); + font-size: 1rem; + font-weight: 600; +} +@media (max-width: 1023px) { + #modules .update-window { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #modules .update-window { + padding: 1rem; + } +} + +#modules .dev-window { + display: grid; + grid-auto-rows: max-content; + row-gap: 1rem; + box-shadow: var(--shadows); + border-radius: 0.3rem; + background-color: var(--windows); +} +#modules > .dev-window > div { + color: var(--windows-font); +} +#modules .dev-window p { + font-size: 1rem; + color: var(--text); +} +#modules .dev-window p a { + color: var(--link); +} + +@media (max-width: 1023px) { + #modules .dev-window { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #modules .dev-window { + padding: 1rem; + } +} + + +#modules .update-window .buttons, #modules .dev-window .buttons { + gap: 1rem; +} +#modules .update-window .buttons a { + width: fit-content; /* для моб */ + justify-self: center; /* для моб */ + color: var(--link); + text-decoration: none; + font-size: 0.9rem; +} +@media (max-width: 767px) { + #modules .update-window .buttons, #modules .dev-window .buttons { + display: grid; + } +} +@media (min-width: 768px) { + #modules .dev-window .buttons { + display: flex; + justify-content: start; + } + #modules .update-window .buttons { + display: grid; + grid-template-columns: auto auto 1fr [book] auto [dev] auto; + } + #modules .update-window .buttons a { + grid-column-start: book; + align-self: center; + } + #modules .update-window .buttons [data-show-dev] { + grid-column-start: dev; + } + /*#modules .update-window .buttons > button { + justify-self: right; + }*/ +} + + +#modules .update-window > div, #modules .dev-window > div { + display: grid; + row-gap: 0.5rem; +} + +#modules .changed-files { + display: grid; + grid-auto-rows: max-content; + row-gap: 1rem; + box-shadow: var(--shadows); + border-radius: 0.3rem; + background-color: var(--windows); + color: var(--template-files-file); + font-size: 13px; + font-family: var(--monospace); + padding: 10px; +} + + + +.classic #start > div { + border-radius: 0; + border: 2px solid #393737; +} + + +/*#region Page Classic*/ + +.classic .lang-selector, +.classic .login .field-select, +.classic .login .lang-select-grid .field-options, +.classic .login-and-password, +.classic .login-and-password .login input, +.classic .login-and-password .password input, +.classic .login-and-password .password button { + border-radius: 0; +} +.classic .login-and-password { + gap: 7px; +} + +.classic .login .field-select, +.classic .login-and-password .login input, +.classic .login-and-password .password input { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #181616; +} + +.classic .login-and-password .password input { + grid-column: 1 / 2; +} + +.classic .login-and-password .password-eye { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #5e5a5a; + border-left: 2px solid #5e5a5a; +} +.classic .login-and-password .password-eye:active { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #312e2d; + background-size: 19px; +} +.classic .login-and-password .password-eye.showed { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #312e2d; + background-size: 19px; +} +.classic .login-and-password .password button { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #5e5a5a; + border-left: 2px solid #5e5a5a; +} +.classic .login-and-password .password button:active { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #312e2d; + background-size: 21px; +} + +.classic .login .lang-select-grid .field-options.open { + border: 2px solid #5b5756; + box-shadow: 0 2px 3px 0 #000000cc; +} + + +@media (min-width: 1025px) { + .classic #pages .pages-grid { + row-gap: 3px; + } +} +.classic #pages .pages-grid > div { + border-radius: 0; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + row-gap: 1px; +} +.classic #pages .pages-grid a.page-name { + margin-bottom: 3px; +} +.classic #pages .page-buttons { + column-gap: 0.3rem; +} + +.dark.classic #pages .page-date { + border-bottom: 1px solid #413e3e; + border-right: 1px solid #413e3e; + border-top: 1px solid #111; + border-left: 1px solid #111; + background-color: #292727; +} +.dark.classic #pages input[type="checkbox"] { + border-radius: 0; + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #111111; + border-left: 2px solid #111111; +} +.classic #pages input[type="checkbox"]:checked { + background-color: var(--orange); + border-bottom: 2px solid #bd3900; + border-right: 2px solid #bd3900; + border-top: 2px solid #762300; + border-left: 2px solid #762300; + box-shadow: 0 0 3px 0.5rem var(--focus-orange); +} + +.classic #pages .page-search { + border-radius: 0; + border-bottom: 2px solid #292727; + border-right: 2px solid #292727; + border-top: 2px solid #111111; + border-left: 2px solid #111111; +} + +.classic #pages .page-prop input, .classic .page-prop textarea, .classic #pages .page-properties input, .classic #pages .page-properties textarea { + border-radius: 0; + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} +.classic #pages .page-prop .field-select, .classic #pages .page-properties .field-select { + border-radius: 0; + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} + +.classic .login .field-select .icon, +.classic #pages .page-prop .field-select > .icon, +.classic #pages .page-properties .field-select > .icon { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #5e5a5a; + border-left: 2px solid #5e5a5a; + background-color: #383433; + margin: 1px; +} + +.classic .login .field-select:active > .icon, +.classic #pages .page-prop .field-select:active > .icon, +.classic #pages .page-properties .field-select:active > .icon { + border-radius: 0; + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic .login .lang-select-grid.open .field-select > .icon, +.classic #pages .page-prop .template-select-grid.open .field-select > .icon, +.classic #pages .page-properties .template-select-grid.open .field-select > .icon { + border-radius: 0; + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} + + + + +.classic #pages .page-prop .field-select, .classic #pages .page-properties .field-select { + grid-template-columns: 1fr 26px; +} +.classic #pages .page-prop .template-select-grid .field-options.open, .classic #pages .page-properties .template-select-grid .field-options.open { + border-radius: 0; + margin-left: 1px; + width: calc(100% - 1px); + border: 2px solid #5b5756; + box-shadow: 0 2px 3px 0 #000000cc; +} + +.classic #pages .page-buttons .page-edit-btn { + margin-left: -5px; +} +.classic #pages .pages-grid > div.open { + background-color: #282525; +} + +.classic #pages .page-buttons div { + height: 24px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + padding: 0px 5px 2px 5px; + outline: 1px solid #1b1a1a; + outline-offset: 0px; +} +@media (max-width: 320px) { + .classic #pages .page-buttons div { + height: 20px; + } +} +.classic #pages .pages-grid > div.open .page-prop-btn { + padding-top: 1px; + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; +} +.classic #pages .page-buttons div:active { + padding-top: 1px; + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; +} + +.classic #pages .page-prop .title, .classic #pages .page-properties .title { + user-select: none; +} + +.classic .page-prop .url-input, .classic .page-properties .url-input { + gap: 5px; +} +.classic .page-prop .url-input > input, .classic #pages .page-properties .url-input > input { + grid-column: 1 / 2; + padding-right: 0; +} +.classic .page-prop .url-input .url-translit, .classic #pages .page-properties .url-input .url-translit { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; + background-size: 22px; + outline-offset: 0px; +} +.classic .page-prop .url-input .url-translit { + outline: 1px solid #1b1a1a; +} +.classic #pages .page-properties .url-input .url-translit { + outline: 1px solid #131313; +} + +.classic .page-prop .url-input .url-translit:active, .classic #pages .page-properties .url-input .url-translit:active { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #1e1d1d; + background-size: 21px; +} + +.classic #pages .counters input { + border-radius: 0; + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #111111; + border-left: 2px solid #111111; +} + + + +.classic #pages .page-editor { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + margin: 0 5px 0 5px; +} +.classic #pages .page-editor-grid > .tags { + background-color: #1e1d1d; + margin: 2px 5px 0 0; +} +.classic #pages .tags-grid > div { + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + background-color: #292727; + user-select: none; +} +.classic #pages .tags-grid > div:active { + border-bottom: 1px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 1px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #292727; +} +.classic #pages .tags-grid { + padding: 0; + gap: 2px; +} + + + +.classic #pages .search-wrapper { + gap: 7px; +} +.classic #pages .page-search { + grid-column: 1 / 3; +} + + +.classic #pages .reset { + border-radius: 0; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; +} +.classic #pages .reset:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #pages .reset:hover { + background-color: transparent; +} + +.classic #pages .page-search-button { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; + border-radius: 0; +} +.classic #pages .page-search-button:active { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} + + +.classic #pages .add-page-btn { + width: 35px; + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; + border-radius: 0; +} +.classic #pages .add-page-btn:active { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} +.classic #pages .add-page-btn:active .x1 { + height: 14px; +} +.classic #pages .add-page-btn:active .x2 { + width: 14px; +} +.classic #pages .add-page-btn:hover { + background-color: unset; +} + +@media (max-width: 1023px) { + .classic #pages .add-page-btn .add-page-label { + display: none; + } +} +@media (min-width: 1024px) { + .classic #pages .add-page-btn { + width: auto; + border: 0; + border-radius: 0; + } + .classic #pages .add-page-btn:active { + border: 0; + } + .classic #pages .add-page-btn:hover { + border: 0; + } + .classic #pages .add-page-btn .add-page-label { + padding: 4px 10px 4px 10px; + border-radius: 0; + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; + } + .classic #pages .add-page-btn .add-page-label:active { + padding-top: 5px; + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + } + .classic #pages .add-page-btn .add-page-label:hover { + background-color: unset; + } + .classic #pages .add-page-btn .x1, .classic #pages .add-page-btn .x2 { + display: none; + } +} + + +.classic #pages .del-pages-btn { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; + border-radius: 0; +} + +.classic #pages .del-pages-btn:active { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #pages .del-pages-btn:hover { + background-color: unset; +} + + +.classic #pages .page-editor-grid { + border-radius: 0; + border: 2px solid #393737; +} +@media (max-width: 1023px) { + .classic #pages .page-editor-grid { + border-top: 2px solid #393737; + border-bottom: 2px solid #393737; + border-right: 0; + border-left: 0; + } +} + +.classic #pages .close-page-button { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; + border-radius: 0; +} +.classic #pages .close-page-button:active { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #pages .close-page-button:hover { + background-color: unset; +} + +.classic #pages .page-editor-buttons { + gap: 4px; +} +@media (min-width: 1024px) { + .classic #pages .page-editor-buttons { + padding: 10px 14px 10px 11px; + } +} + +.classic #pages .save-page-button, +.classic #pages .open-properties, +.classic #pages .classic .page-editor-grid.properties, +.classic #pages .open-mediateka { + height: 25px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + padding: 0px 5px 2px 5px; +} +.classic #pages .page-editor-buttons > div { + outline: 1px solid #131313; + outline-offset: 0px; +} +.classic #pages .save-page-button:active, +.classic #pages .open-properties:active, +.classic #pages .classic .page-editor-grid.properties:active, +.classic #pages .open-mediateka:active { + height: 25px; + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} + +.classic #pages .page-editor-buttons .save-page-button:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} +.classic #pages .page-editor-grid .tags-helper { + height: 25px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + padding: 0px 5px 2px 5px; +} +.classic #pages .page-editor-grid.tags-opened .tags-helper { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} +.classic #pages .page-editor-grid .tags-helper:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} + +.classic #pages .page-editor-grid.properties .open-properties { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} +.classic #pages .page-editor-grid.mediateka .open-mediateka { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} + +.classic #pages .codemirror-replace { + height: 25px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + padding: 0px 5px 2px 5px; +} +.classic #pages .codemirror-replace:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} + +.classic #pages .page-editor-buttons a, .classic #pages .page-editor-buttons a { + padding: 0px 5px 2px 5px; +} + + + + + + + + +.classic #pages .file-block { + border-radius: 0; + border: 2px solid var(--br-3); +} + + + + + +.classic #pages .upload-files { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; +} +.classic #pages .upload-files:active { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #000000; + border-left: 2px solid #000000; +} +.classic #pages .mediateka-buttons .inputfile + label { + padding-top: 9px; +} +.classic #pages .upload-files:active label { + padding-top: 10px; +} + +.classic #pages .link-file { + border-bottom: 1px solid #413e3e; + border-right: 1px solid #413e3e; + border-top: 1px solid #000000; + border-left: 1px solid #000000; + border-radius: 0; +} +.classic #pages .link-file-copy-btn { + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + border-radius: 0; + height: 32px; + line-height: 28px; + align-items: unset; +} +.classic #pages .link-file-copy-btn:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + border-radius: 0; + padding-top: 1px; +} + +.classic #pages .del-uploaded-files.disabled { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + box-shadow: unset; + border-radius: 0; +} +.classic #pages .del-uploaded-files.disabled:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding-top: 10px; +} + +.classic #pages .del-uploaded-files { + border-bottom: 1px solid #ff6b29; + border-right: 1px solid #ff6b29; + border-top: 1px solid #ff844d; + border-left: 1px solid #ff844d; + box-shadow: 0 0 3px 5px var(--focus-orange); + border-radius: 0; + height: 40px; + padding-top: 10px; + align-items: unset; + user-select: none; +} +.classic #pages .del-uploaded-files:hover { + box-shadow: 0 0 3px 5px var(--focus-orange); +} +.classic #pages .del-uploaded-files:active { + border-bottom: 1px solid #ff6b29; + border-right: 1px solid #ff6b29; + border-top: 1px solid #ffb492; + border-left: 1px solid #ffb492; + padding-top: 11px; +} + +/*#endregion Page Classic*/ + + + + + +/*#region Menu Classic*/ + + +.classic #menu .menu, +.classic #menu .item, +.classic #menu .items-grid, +.classic #menu input[type="text"], +.classic #menu .menu-prop .field-select-menu, +.classic #menu .menu-prop .area-select-grid .field-options.open, +.classic #menu .menu-prop .field-select, +.classic #menu .target-blank input[type="checkbox"], +.classic #menu .select-grid .select-dropdown, +.classic #menu .menu-prop .parent-select-grid .field-options, +.classic #menu .menu-grid > div > .items-grid { + border-radius: 0; +} + +.classic #menu .menu-grid > div { + border: 2px solid #393737; + border-radius: 0; +} + +.classic #menu .item { + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; +} + +.classic #menu .menu .menu-buttons, .classic #menu .item .menu-buttons { + column-gap: 0.3rem; +} +.classic #menu .menu .menu-buttons > div { + outline: 1px solid #1b1a1a; + outline-offset: 0px; +} +.classic #menu .item .menu-buttons > div { + outline: 1px solid #111111; + outline-offset: 0px; +} +.classic #menu .will-be-deleted .item .menu-buttons .del { + outline: 1px dashed red; + outline-offset: 2px; +} + +.classic #menu .menu-buttons div { + height: 24px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + padding: 0px 5px 2px 5px; +} +.classic #menu .menu-buttons div:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} +.classic #menu .menu-grid > div.will-be-deleted .del, .classic #menu .will-be-deleted .item .del { + border-radius: 0; +} + +.classic #menu .menu .save { + opacity: 0; + pointer-events: none; +} +.classic #menu .menu.changed .save { + opacity: 1; + color: var(--save-menu); + pointer-events: all; +} + +.classic #menu .item .save { + opacity: 0; + pointer-events: none; +} +.classic #menu .item.changed .save { + opacity: 1; + color: var(--save-menu); + pointer-events: all; +} + +.classic #menu .menu.open .prop { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} + +.classic #menu .item.open .prop { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} + + +.classic #menu .item.highlite-children::after { + margin-left: -16px; + width: 16px; +} +@media (max-width: 767px) { + .classic #menu .item.highlite-children::after { + margin-left: -8px; + width: 8px; + } +} + +.classic #menu .menu .area.title, .classic #menu .menu .classes.title, .classic #menu .item .menu-prop > .title { + user-select: none; +} +.classic #menu .menu input[name=title], +.classic #menu .menu input[name=classes], +.classic #menu .menu input[name=sort] { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} + +.classic #menu .menu-prop .field-select-menu { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} + +.classic #menu .menu-prop .field-select-menu > .icon, +.classic #menu .menu-prop .field-select > .icon { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #5e5a5a; + border-left: 2px solid #5e5a5a; + background-color: #383433; +} + +.classic #menu .menu-prop .field-select-menu:active > .icon, .classic #menu .menu-prop .field-select:active > .icon { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #menu .menu-prop .area-select-grid.open .field-select-menu > .icon, +.classic #menu .menu-prop .select-grid.open .field-select > .icon, +.classic #menu .menu-prop .parent-select-grid.open .field-select > .icon { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} + +.classic #menu .menu-prop .area-select-grid.open .field-options, +.classic #menu .menu-prop .select-grid.open .select-dropdown, +.classic #menu .menu-prop .parent-select-grid.open .field-options { + border: 2px solid #5b5756; +} + +.classic #menu .menu-prop .field-select, +.classic #menu .item input[name=title], +.classic #menu .item input[name=tag_title], +.classic #menu .item input[name=url], +.classic #menu .item input[name=classes], +.classic #menu .item input[name=sort] { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} +.classic #menu .target-blank input[type="checkbox"] { + margin-top: 2px; +} +.classic #menu .main-footer .create { + border-radius: 0; + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #4c4949; + border-left: 2px solid #4c4949; + padding: 4px 11px 5px 11px; + height: 35px; +} +.classic #menu .main-footer .create:active { + border-bottom: 2px solid #4c4949; + border-right: 2px solid #4c4949; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + padding: 5px 11px 5px 11px; +} + +/*#endregion Page Classic*/ + + + + + + +/*#region Base Classic*/ + +.classic #base .db-settings { + border-radius: 0; + border: 2px solid #393737; +} +.classic #base form input { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + border-radius: 0; +} + + +.classic #base form input[name="password"] { + grid-column: 1 / 2; + padding-right: 0.54rem; +} +.classic #base form .password-widget input { + grid-column: 1 / 2; +} +.classic #base .pro-btn { + height: 34px; + border-bottom: 1px solid #111111; + border-right: 1px solid #111111; + border-top: 1px solid #413e3e; + border-left: 1px solid #413e3e; + background-color: #292727; +} +.classic #base .pro-btn:active { + padding-top: 6px; + border-bottom: 1px solid #413e3e; + border-right: 1px solid #413e3e; + border-top: 1px solid #111111; + border-left: 1px solid #111111; +} +.classic #base form.show-pro .pro-btn { + padding-top: 6px; + border-bottom: 1px solid #413e3e; + border-right: 1px solid #413e3e; + border-top: 1px solid #111111; + border-left: 1px solid #111111; +} + +.classic #base form .password-eye { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #5e5a5a; + border-left: 2px solid #5e5a5a; +} +.classic #base form .password-eye:active { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #272423; + background-position: center calc(50% + 1px); +} +.classic #base form .password-eye.showed { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #272423; + background-position: center calc(50% + 1px); +} +.classic button { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #4c4949; + border-left: 2px solid #4c4949; + padding-top: 4px; + height: 35px; + border-radius: 0; + background-color: #2a2828; +} +.classic button:active { + border-bottom: 2px solid #4c4949; + border-right: 2px solid #4c4949; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-color: #1e1d1d; + padding-top: 5px; + background-color: #272423; +} +.classic #base form .pro-btn { + border-radius: 0; +} + + +/*#endregion Base Classic*/ + + + + + + +/*#region Modules Classic*/ + + +.classic #modules .update-window, .classic #modules .dev-window, .classic #modules .changed-files { + border: 2px solid #393737; + border-radius: 0; +} + +.classic #modules .upload_dnd { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #4c4949; + border-left: 2px solid #4c4949; + padding: 6px 11px 5px 11px; + height: 40px; + border-radius: 0; +} +.classic #modules .upload_dnd:active { + border-bottom: 2px solid #4c4949; + border-right: 2px solid #4c4949; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + padding: 7px 11px 4px 11px; +} + +.classic #modules > div { + row-gap: 5px; +} +@media (min-width: 1025px) { + .classic #modules > .modules-grid { + row-gap: 3px; + } +} + +.classic #modules .module-description { + margin-bottom: 3px; +} + +.classic #modules .modules-grid > div { + border-radius: 0; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; +} + + +.classic #modules .module-sw-btn, .classic #modules .module-del-btn { + padding: 0px 5px 2px 5px; + outline: 1px solid #1b1a1a; + outline-offset: 0px; +} +.classic #modules .enabled .module-sw-btn { + height: 24px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; +} +.classic #modules .enabled .module-sw-btn:active { + padding-top: 1px; + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c +} +.classic #modules .disabled .module-sw-btn, .classic #modules .enabled .module-sw-btn { + margin-left: -5px; +} +.classic #modules .disabled .module-sw-btn { + height: 24px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; +} +.classic #modules .disabled .module-sw-btn:active { + padding-top: 1px; + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c +} + +.classic #modules .module-del-btn { + height: 24px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; +} +.classic #modules .module-del-btn:active { + padding-top: 1px; + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; +} +.classic #modules .module-version { + text-align: center; + padding: 0 5px 1px 5px; + border-bottom: 1px solid #413e3e; + border-right: 1px solid #413e3e; + border-top: 1px solid #111; + border-left: 1px solid #111; + background-color: #292727; +} + +/*#endregion Modules Classic*/ + + + + + + +/*#region Admin_Menu Classic*/ + +.classic #admin_menu .field-select { + grid-template-columns: 1fr 26px; +} + +.classic #admin_menu .am-grid > div, +.classic #admin_menu [data-am-type="section"], +.classic #admin_menu .items-grid, +.classic #admin_menu [data-am-type="item"], +.classic #admin_menu input, +.classic #admin_menu .field-select, +.classic #admin_menu .field-options, +.classic #admin_menu .add-section, +.classic #admin_menu .reset-all { + border-radius: 0; +} +.classic #admin_menu .am-grid > div { + border: 2px solid #393737; +} +.classic #admin_menu [data-am-type="item"] { + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; +} + + +.classic #admin_menu .items-grid { + padding: 13px 3px 8px 8px; +} + + +.classic #admin_menu [data-am-type="section"] input[name=title], .classic #admin_menu [data-am-type="section"] input[name=sort] { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} + +.classic #admin_menu input { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} + + +.classic #admin_menu .field-select { + gap: 7px; + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} +.classic #admin_menu .field-select > .icon { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #5e5a5a; + border-left: 2px solid #5e5a5a; + background-color: #383433; + margin: 1px; +} +.classic #admin_menu .field-select:active > .icon { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #admin_menu .section-select-grid.open .field-select > .icon { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #admin_menu .section-select-grid.open .field-options { + border: 2px solid #5b5756; +} + +.classic #admin_menu [data-am-type] .buttons { + gap: 10px; +} + +.classic #admin_menu [data-am-type] .buttons > a { + height: 24px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + padding: 0px 5px 2px 5px; + outline: 1px solid #1b1a1a; + outline-offset: 0px; +} +.classic #admin_menu [data-am-type] .buttons > a:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding: 1px 5px 2px 5px; +} +.classic #admin_menu .items-grid [data-am-type] .buttons > a { + outline: 1px solid #111111; +} + +.classic #admin_menu .add-section, .classic #admin_menu .reset-all { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #4c4949; + border-left: 2px solid #4c4949; + padding: 4px 11px 5px 11px; + height: 35px; +} +.classic #admin_menu .add-section:active, .classic #admin_menu .reset-all:active { + border-bottom: 2px solid #4c4949; + border-right: 2px solid #4c4949; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + padding: 5px 11px 5px 11px; +} + + + +/*#endregion Admin_Menu Classic*/ + + + + + +/*#region Pages Classic*/ + +.classic #pages .main-footer .pager > div { + height: 22px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + outline: 1px solid #0b0b0b; + outline-offset: 0px; + border-radius: 0; + align-items: unset; +} +.classic #pages .main-footer .pager > div:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + outline: 1px solid #0b0b0b; + outline-offset: 0px; + padding-top: 1px; +} + +.classic #pages .main-footer .pager > div.active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + padding-top: 1px; +} + +/*#endregion Pages Classic*/ + + + + + +/*#region Auth Classic*/ + +.classic #auth form { + border-radius: 0; + border: 2px solid #393737; +} + +.classic #auth form input { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + border-radius: 0; +} + +.classic #auth form input[name="admin_password"] { + grid-column: 1 / 2; +} +.classic #auth form .password-eye { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #5e5a5a; + border-left: 2px solid #5e5a5a; + background-color: var(--windows); +} +.classic #auth form .password-eye:active { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #auth form .password-eye.showed { + border-bottom: 2px solid #5e5a5a; + border-right: 2px solid #5e5a5a; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #auth .sess-table > div { + padding: 5px 5px 5px 2px; +} +@media (min-width: 1025px) { + .classic #auth .sess-table { + row-gap: 0; + } +} +@media (max-width: 1024px) { + .classic #auth .sess-table > div { + display: grid; + grid-template-columns: 1fr auto; + gap: 5px; + } + .classic #auth .sess-table .date { + grid-column: 1/2; + grid-row: 1/2; + } + .classic #auth .sess-table .del-sess { + grid-column: 2/3; + grid-row: 1/2; + float: unset; + } + .classic #auth .sess-table .ip { + grid-column: 1/2; + } + .classic #auth .sess-table .agent { + grid-column: 1/-1; + } + .classic #auth .sess-table > div { + padding: 5px 5px 5px 5px; + } +} + +.classic #auth .sess-table > div, .classic #auth .del-sess { + border-radius: 0; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + align-items: start; +} + + + +.classic #auth .del-sess { + width: 24px; + height: 24px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; +} +.classic #auth .del-sess:active { + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + background-position: center calc(50% + 1px); + background-color: var(--bg-3); +} +.classic #auth .sess-table .date, .classic #auth .sess-table .ip { + border-bottom: 1px solid #413e3e; + border-right: 1px solid #413e3e; + border-top: 1px solid #111; + border-left: 1px solid #111; + background-color: #292727; + text-align: center; +} + + +/*#endregion Auth Classic*/ + + + + + + +/*#region SiteMap Classic*/ + +.classic #sitemap .sitemap, +.classic #sitemap .xml-wrapper-hidden, +.classic #sitemap .xml-wrapper-link, +.classic #sitemap .xml-static-dynamic, +.classic #sitemap .xml-static-cron, +.classic #sitemap .sitemap-manual { + border-radius: 0; + border: 2px solid #393737; +} + +.classic #sitemap form div > input, +.classic #sitemap .xml-static-cron input[type="text"], +.classic #sitemap textarea { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + border-radius: 0; +} + +.classic #sitemap .select-dropdown ul.list-search { + border-radius: 0; +} +.classic #sitemap .select-dropdown.open ul.list-search { + border: 2px solid #5b5756; +} + +/*#endregion SiteMap Classic*/ + + + + + + +/*#region RSS Classic*/ + +.classic #rss .rss, +.classic #rss .xml-wrapper-hidden, +.classic #rss .xml-static-dynamic, +.classic #rss .xml-static-cron { + border-radius: 0; + border: 2px solid #393737 +} + +.classic #rss form div > input, +.classic #rss textarea, +.classic #rss .xml-static-cron input[type="text"], +.classic #rss .xml-static-dynamic input[type="text"] { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + border-radius: 0; +} + +.classic #rss .select-dropdown.open ul.list-search { + border-radius: 0; +} +.classic #rss .select-dropdown.open ul.list-search { + border: 2px solid #5b5756; +} + +/*#endregion RSS Classic*/ + + + + + + +/*#region Template Classic*/ + +.classic #template .upload_dnd { + border-radius: 0; +} + +.classic #template .template-install, +.classic #template .upload_dnd, +.classic #template .template, +.classic #template .field-select, +.classic #template .template-select-grid .field-options.open, +.classic #template input[type="checkbox"], +.classic #template .template-headers, +.classic #template .template-manual, +.classic #template .template-files, +.classic #template .template-headers textarea { + border-radius: 0; + border: 2px solid #393737; +} + + +.classic #template .field-select { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} +.classic #template .field-select > .icon { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #5e5a5a; + border-left: 2px solid #5e5a5a; + background-color: #2a2828; + margin: 1px; +} +.classic #template .field-select:active > .icon { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #template .template-select-grid.open .field-select > .icon { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #template .template-select-grid.open .field-options { + border: 2px solid #5b5756; +} + + +.classic #template .template input[type="checkbox"] { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} +.classic #template .template input[type="checkbox"]:checked { + border-bottom: 2px solid #bd3900; + border-right: 2px solid #bd3900; + border-top: 2px solid #762300; + border-left: 2px solid #762300; +} +.classic #template .template-headers textarea { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; +} + + + +.classic #template .upload_dnd { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #4c4949; + border-left: 2px solid #4c4949; + padding: 6px 11px 5px 11px; + height: 40px; + background-color: #2a2828; +} +.classic #template .upload_dnd:active { + border-bottom: 2px solid #4c4949; + border-right: 2px solid #4c4949; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + padding: 7px 11px 5px 11px; + background-color: #272423; +} + +@media (min-width: 1024px) { + .classic #template .template-editor-grid { + border-radius: 0; + border: 2px solid #393737; + } +} +@media (max-width: 1023px) { + .classic #template .template-editor-grid { + border-top: 2px solid #393737; + border-bottom: 2px solid #393737; + border-right: 0; + border-left: 0; + } +} + +.classic #template .close-template-button { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; + border-radius: 0; +} +.classic #template .close-template-button:active { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #template .close-template-button:hover { + background-color: unset; +} + + +.classic #template .save-template-button { + border-bottom: 2px solid #0c0c0c; + border-right: 2px solid #0c0c0c; + border-top: 2px solid #393737; + border-left: 2px solid #393737; + border-radius: 0; +} +.classic #template .save-template-button:active { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); +} +.classic #template .save-template-button:hover { + background-color: unset; +} +.classic #template .save-template-button.saved { + border-bottom: 2px solid #393737; + border-right: 2px solid #393737; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + background-position: center calc(50% + 1px); + background-color: var(--saved-bg); +} + +.classic #template .template-editor { + border-bottom: 2px solid #413e3e; + border-right: 2px solid #413e3e; + border-top: 2px solid #0c0c0c; + border-left: 2px solid #0c0c0c; + margin: 0 5px 0 5px; +} + +.classic #template .snip-grid { + background-color: #1e1d1d; + margin: 2px 5px 0 0; +} +.classic #template .html, .classic #template .css, .classic #template .php { + padding: 0; + gap: 2px; +} +.classic #template .snip-grid > .html > div, +.classic #template .snip-grid > .css > div, +.classic #template .snip-grid > .php > div { + height: 36px; + border-bottom: 1px solid #0c0c0c; + border-right: 1px solid #0c0c0c; + border-top: 1px solid #393737; + border-left: 1px solid #393737; + background-color: #292727; + user-select: none; +} +.classic #template .snip-grid > .html > div:active, +.classic #template .snip-grid > .css > div:active, +.classic #template .snip-grid > .php > div:active { + padding-top: 8px; + border-bottom: 1px solid #393737; + border-right: 1px solid #393737; + border-top: 1px solid #0c0c0c; + border-left: 1px solid #0c0c0c; + background-color: #292727; +} + + + + + + +/*#endregion Template Classic*/ + + diff -r 000000000000 -r 78edf6b517a0 .cms/css/base.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/css/base.css Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,127 @@ +#base { + display: grid; + gap: 1rem; + overflow-y: auto; + max-height: 100%; +} + +@media (max-width: 1023px) { +#base { + padding: 1rem 0.4rem 1rem 0.4rem; + } +} + +@media (min-width: 1024px) { + #base { + grid-template-columns: 17rem 1fr; + grid-template-rows: auto; + padding: 1rem; + } +} + +#base .db-settings { + grid-column: 1/2; + background-color: var(--windows); + background-image: var(--noise); + box-shadow: var(--shadows); + border-radius: 0.3rem; +} +@media (max-width: 1023px) { + #base .db-settings { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #base .db-settings { + padding: 1rem; + } +} + +#base form { + display: grid; + row-gap: 2rem; +} + +#base form > div { + position: relative; + display: grid; + row-gap: 1rem; +} +#base .create { + font-size: 1rem; + color: var(--names); + text-align: center; + user-select: none; +} + + +#base form div > div div:not(.password-eye) { + font-size: 1rem; + margin-bottom: 3px; + color: var(--windows-font); +} + +#base form .pro-btn { + cursor: pointer; + text-align: center; + padding: 0.3rem; + border: 1px solid var(--bg-3); + border-radius: 0.2rem; + color: var(--link); + user-select: none; +} +#base form .pro { + display: none; +} +#base form.show-pro .pro { + display: grid; +} + + + +#base form .password-widget { + display: grid; + grid-template-columns: 1fr auto; + gap: 5px; +} +#base form .password-widget input { + grid-column: 1/-1; + grid-row: 1/2; +} + +#base form input { + border-radius: 4px; + font-size: 0.875rem; + font-family: var(--monospace); + padding: 0 0.54rem 3px 0.54rem; + min-height: 35px; + height: 35px; + width: 100%; + color: var(--input-font); + background-color: var(--input-bg); + border: 2px solid var(--input-border); +} +#base form input[name="password"] { + grid-column: 1 / -1; + grid-row: 1 / 2; + padding-right: 2.2rem; +} + +#base form > div > div { + position: relative; +} +#base form .password-eye { + grid-column: 2 / 3; + grid-row: 1 / 2; + width: 34px; + height: 34px; + z-index: 1; + cursor: pointer; + background-repeat: no-repeat; + background-size: 20px; + background-position: center; + background-image: var(--eye-off); +} +#base form .password-eye.showed { + background-image: var(--eye-on); +} diff -r 000000000000 -r 78edf6b517a0 .cms/css/menu.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/css/menu.css Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,682 @@ +#menu { + display: grid; + height: 100%; + overflow-y: auto; + grid-auto-rows: max-content; +} + + +@media (max-width: 1023px) { + #menu .main-main { + padding: 0.4rem; + } +} +@media (min-width: 1024px) { + #menu .main-main { + padding: 1rem 1rem 0.3rem 1rem; + } +} + +#menu .menu.last-edited::before, #menu .item.last-edited::before { + content: ""; + position: absolute; + left: 3px; + top: 3px; + z-index: 1; + width: 7px; + height: 7px; + border-radius: 50%; + background-color: var(--green-3); +} + +#menu .menu-grid { + display: grid; + row-gap: 2rem; + color: var(--windows-font); +} + +#menu .menu-grid > div { + box-shadow: 0 0 3px 0 #00000096; + border-radius: 0.3rem; +} + +#menu .menu { + display: grid; + grid-template-areas: + "title sort" + "buttons buttons"; + grid-template-columns: 1fr auto; + column-gap: 0.5rem; + row-gap: 0.5rem; + background-color: var(--windows); + border-radius: 0.3rem; + position: relative; + padding: 0.7rem; +} +#menu .menu.open { + grid-template-areas: + "title sort" + "buttons buttons" + "menu-prop menu-prop"; +} +#menu .menu.open .prop { + color: var(--menu-menu-open-prop); +} +#menu .menu.changed { + outline: 1px dashed var(--save-menu); + outline-offset: 0px; +} +#menu .menu .save > span { + display: none; +} +#menu .menu.changed .save > span { + display: block; + color: var(--save-menu); +} + + +#menu .menu .menu-prop { + display: none; +} +#menu .menu.open .menu-prop { + display: grid; + grid-area: menu-prop; +} +@media (max-width: 1023px) { + #menu .menu.open .menu-prop { + grid-template-areas: + "area-title" + "select" + "classes-title" + "classes"; + } + #menu .menu .menu-prop > div:not(:first-child) { + padding-top: 0.75rem; + } + #menu .menu .menu-prop > .area-select-grid:not(:first-child) { + padding-top: 0; + } +} +@media (min-width: 1024px) { + #menu .menu.open .menu-prop { + grid-template-areas: + "area-title select classes-title classes"; + grid-template-columns: 6em minmax(240px, 100%) 6em minmax(240px, 100%); + row-gap: 0.75rem; + column-gap: 0.7rem; + padding: 0.5rem 0 0.3rem 0; + } +} + +#menu .menu input[name=title] { + grid-area: title; + line-height: 27px; + background-color: var(--menu-input-bg); + border: 2px solid var(--menu-input-border); +} +#menu .menu input[name=sort] { + grid-area: sort; + width: 4rem; + text-align: center; + font-size: 0.9rem; + background-color: var(--menu-input-bg); + border: 2px solid var(--menu-input-border); +} +#menu .menu .area.title { + grid-area: area-title; + font-size: 1rem; + line-height: 27px; +} + +#menu .menu .classes.title { + grid-area: classes-title; + font-size: 1rem; + line-height: 27px; +} +#menu .menu input[name=classes] { + grid-area: classes; + font-size: 0.9rem; + background-color: var(--menu-input-bg); + border: 2px solid var(--menu-input-border); +} + + +@media (min-width: 1024px) { + #menu .menu .area.title, #menu .menu .classes.title { + justify-self: right; + } +} +#menu input[type="text"] { + padding: 0 0.54rem; + border-radius: 4px; + min-height: 30px; + font-size: 0.94rem; + height: 100%; + background-color: var(--bg-4); + border: 1px solid var(--bg-4); + color: var(--text); + width: 100%; + max-width: 100%; +} + +#menu .menu-buttons { + grid-area: buttons; + display: grid; + column-gap: 0.7rem; + font-size: 0.9rem; +} +#menu .menu-buttons > div { + display: flex; /* Chrome Mobile Browser - Fonts Size */ +} +#menu .menu .menu-buttons { + grid-template-columns: auto auto 1fr auto; +} +#menu .menu-buttons div { + cursor: pointer; + user-select: none; + color: var(--buttons-font); + width: max-content; +} +#menu .menu-buttons div:active { + color: var(--buttons-hover); +} +@media (min-width: 1024px) { + #menu .menu-buttons div:hover { + color: var(--buttons-hover); + } +} + + +/*Items*/ +#menu .items-grid { + display: grid; + row-gap: 0.3rem; + padding: 0.8rem 0 0.5rem 0.5rem; + margin-top: -5px; + background-color: var(--windows); + border-radius: 0 0 0 0.3rem; +} +@media (min-width: 768px) { + #menu .items-grid .items-grid { + padding-left: 1rem; + } +} +#menu .menu-grid > div > .items-grid { + border-radius: 0 0 0.3rem 0.3rem; +} + +#menu .items-grid .items-grid { + box-shadow: inset 0 0 0 1px var(--windows-hover); +} + +#menu .item { + display: grid; + grid-template-areas: + "title" + "buttons"; + row-gap: 0.5rem; + background-color: var(--bg-3); + background-image: var(--noise); + border-radius: 0.3rem 0 0 0.3rem; + position: relative; + padding: 0.7rem; +} + + +/*Lines*/ +#menu .item.clicked + .items-grid { + box-shadow: inset 1px -1px 0 0 var(--green-3); +} +#menu .items-grid:has(> * > .last-edited) { + box-shadow: inset 1px -1px 0 0 var(--green-3); +} +#menu div:has(> .item > .menu-buttons .append:hover) > .items-grid { + box-shadow: inset 1px -1px 0 0 var(--green-3); +} + + +#menu > .main-main .menu-grid > div > .items-grid.highlite-parent > div > .item.highlite-children::after { + margin-left: -7px; + width: 7px; +} + +#menu .items-grid.highlite-parent { + box-shadow: inset 1px 0px 0 0 var(--sub-line); +} + +#menu .item.highlite-children::after { + content: ""; + position: absolute; + margin-left: -15px; + top: calc(50% - 1px); + border-top: 1px solid var(--sub-line); + width: 15px; +} +@media (max-width: 767px) { + #menu .item.highlite-children::after { + margin-left: -7px; + width: 7px; + } +} +#menu .item.highlite-children + .items-grid { + box-shadow: inset 1px -1px 0 0 var(--green-3); +} +/*Lines End*/ + + +@media (min-width: 1024px) { + #menu .item:hover { + background-color: var(--open-menu); + } +} +#menu .item.open { + grid-template-areas: + "title" + "buttons" + "menu-prop"; + background-color: var(--open-menu); +} + +#menu .item .menu-buttons { + grid-template-columns: auto auto 1fr auto; +} +#menu .item.open .menu-buttons { + grid-template-columns: auto auto 1fr auto; +} + +#menu .item.changed { + outline: 1px dashed var(--save-menu); + outline-offset: 0px; +} +#menu .item .save > span { + display: none; +} +#menu .item.changed .save > span { + display: block; + color: var(--save-menu); +} + + +#menu .item .menu-prop > .title { + font-size: 1rem; + line-height: 27px; + color: var(--names); +} + + +#menu .menu-grid > div.will-be-deleted { + outline: 1px dashed red; + outline-offset: 0px; +} +#menu .menu-grid > div.will-be-deleted .del { + outline: 1px dashed red; + outline-offset: 2px; + border-radius: 1px; +} + +#menu .will-be-deleted .item { + outline: 1px dashed red; + outline-offset: -1px; +} +#menu .will-be-deleted .item .del { + outline: 1px dashed red; + outline-offset: 2px; + border-radius: 1px; +} + +@media (min-width: 1024px) { + #menu .item .menu-buttons div { + opacity: 0; + } + #menu .item:hover div { + opacity: 1; + } + #menu .item.open div { + opacity: 1; + } + #menu .item .menu-prop > .title { + text-align: right; + } +} + + + +#menu .item .menu-prop { + display: none; +} +#menu .item.open .menu-prop { + display: grid; + grid-area: menu-prop; +} +#menu .item.open .prop { + color: var(--menu-item-open-prop); +} + +#menu .item a { + grid-area: title; + display: flex; + width: fit-content; + margin-top: -5px; + font-size: 1rem; + text-decoration: none; + min-height: 21px; /* for empty title */ +} +#menu .item a[href] { + color: var(--menu-item-a); +} +#menu .item a[href]:hover { + color: var(--menu-item-a-hover); +} +#menu .item a:not([href]) { + width: fit-content; + margin-top: -5px; + font-size: 1rem; + min-height: 21px; + color: var(--menu-item-a-none-link); +} + +@media (max-width: 1023px) { + #menu .item .menu-prop { + grid-template-areas: + "page-title" + "select-grid" + "parent-title" + "pid" + "title-name" + "title" + "tag-title" + "tag_title" + "url-title" + "target-blank" + "classes-title" + "classes" + "sort-title" + "sort"; + } +} +@media (min-width: 1024px) { + #menu .item .menu-prop { + grid-template-areas: + "page-title select-grid parent-title pid" + "title-name title tag-title tag_title" + "url-title target-blank classes-title classes" + ". . sort-title sort"; + grid-template-columns: 6em minmax(240px, 100%) 6em minmax(240px, 100%); + row-gap: 0.75rem; + column-gap: 0.7rem; + padding: 0.5rem 0 0.3rem 0; + } +} + +#menu .item .page.title { + grid-area: page-title; +} +#menu .item .select-grid { + grid-area: select-grid; +} + + +#menu .item .parent.title { + grid-area: parent-title; +} + +#menu .item input[name=pid] { + grid-area: pid; +} + +#menu .item .title.name { + grid-area: title-name; +} +#menu .item input[name=title] { + grid-area: title; +} + + +#menu .item .tag.title { + grid-area: tag-title; +} +#menu .item input[name=tag_title] { + grid-area: tag_title; +} + + + +#menu .item .classes.title { + grid-area: classes-title; +} +#menu .item input[name=classes] { + grid-area: classes; +} + + +#menu .item .url.title { + grid-area: url-title; +} +#menu .item .target-blank { + grid-area: target-blank; + display: grid; + grid-template-columns: 1fr 30px; + column-gap: 0.5rem; + position: relative; +} +#menu .item input[name=url] { + width: 100%; + grid-column: 1/-1; + grid-row: 1/2; +} +#menu .item input[name=url][disabled] { + color: var(--menu-input-select-font-disabled); +} + +#menu .item .sort.title { + grid-area: sort-title; +} +#menu .item input[name=sort] { + grid-area: sort; + width: 5rem; + text-align: center; +} + +@media (max-width: 1023px) { + #menu .item .parent-title, #menu .item .title, #menu .item .tag-title, #menu .item .url-title, #menu .item .classes-title, #menu .item .sort-title { + padding-top: 0.75rem; + } +} + +#menu .target-blank input[type="checkbox"] { + grid-row: 1/2; + grid-column: 2/3; + align-self: center; + justify-self: center; + border: 2px solid var(--orange); +} + + +#menu .select-grid .field-options { + position: relative; +} +#menu .select-grid .select-dropdown { + display: grid; + position: absolute; + left: 0; + right: 0; + top: 2px; + background-color: var(--bg-3); + border: 2px solid var(--bg-4); + color: var(--menu-item-select-dropdown-font); + border-radius: 0.25rem; + z-index: 7; + overflow: hidden; + box-shadow: 0 2px 3px 0 #00000033; +} +#menu .select-grid .field-search { + display: grid; + padding: 0.37rem; + border-bottom: 2px solid var(--bg-4); +} +#menu .select-grid .field-search input { + width: 100%; + background-color: var(--menu-item-field-search-input-bg); + color: var(--text); + border: 2px solid var(--bg-4); + font-size: 0.94rem; + background-repeat: no-repeat; + background-position: right .37rem center; + padding: 0.25rem 2rem 0.25rem 0.25rem; + background-size: 17px 14px; +} +#menu .select-grid .field-search input { + background-image: var(--search-icon); +} +#menu .select-grid .field-search input:focus { + border: 2px solid var(--menu-item-field-search-input-focus); + transition: all .700s ease 0s; +} +#menu .select-grid ul.list-search, #menu .item .field-search { + background-color: var(--bg-3); +} +#menu .select-grid ul.list-search { + display: grid; + margin: 0; + padding: 0; + overflow-y: auto; + max-height: 17rem; + overscroll-behavior: contain; +} +#menu .select-grid .list-search li { + display: block; + list-style-type: none; + padding: 0.4rem 0.44rem; + cursor: pointer; + font-size: 0.94rem; + text-align: left; +} +#menu .select-grid .list-search li:hover { + background-color: var(--menu-item-list-search-li-hover-active); +} +#menu .select-grid .list-search li.active { + background-color: var(--menu-item-list-search-li-hover-active); +} +#menu .select-grid .list-search li.searcher-hidden { display: none; } +#menu .select-grid .field-options { overflow: hidden; } +#menu .select-grid .field-options.open { overflow: initial; } + +#menu .main-footer { + padding: 1rem; +} + +@media (max-width: 1023px) { + #menu .main-footer { + padding: 0.7rem 0.4rem 1rem 0.4rem; + } +} +@media (min-width: 1024px) { + #menu .main-footer { + padding: 1rem; + } +} + +#menu .main-footer .create { + display: block; + width: max-content; + padding: 0.4rem 0.7rem 0.5rem 0.7rem; + background-color: var(--bg-4); + text-decoration: none; + font-size: 0.9rem; + color: var(--windows-font); + border-radius: 0.3rem; + cursor: pointer; + user-select: none; +} + + +/* Select */ +#menu .menu-prop .area-select-grid, #menu .item .menu-prop .parent-select-grid { + position: relative; +} + +#menu .menu-prop .field-select-menu { + display: grid; + grid-template-columns: 1fr 26px; + height: 100%; + cursor: pointer; + background-color: var(--menu-input-bg); + border: 2px solid var(--menu-input-border); + border-radius: 4px; + user-select: none; + line-height: 26px; + font-size: 1rem; +} +#menu .menu-prop .field-select-menu > .value { + padding: 0 0 0 0.44rem; + white-space: nowrap; + overflow: hidden; + line-height: 26px; + font-size: 0.94rem; + color: var(--text); +} +#menu .menu-prop .field-select-menu > .icon { + background-image: var(--select-icon); + background-repeat: no-repeat; + background-position: center; + background-size: 12px; +} + +#menu .menu-prop .field-select { + display: grid; + grid-template-columns: 1fr 26px; + height: 100%; + min-height: 30px; + cursor: pointer; + background-color: var(--bg-4); + border: 1px solid var(--bg-4); + border-radius: 4px; + user-select: none; +} +#menu .menu-prop .field-select > .value { + padding: 0 0 0 0.44rem; + white-space: nowrap; + overflow: hidden; + line-height: 26px; + font-size: 0.94rem; + color: var(--text); +} +#menu .menu-prop .field-select > .icon { + background-image: var(--select-icon); + background-repeat: no-repeat; + background-position: center; + background-size: 12px; +} + +#menu .menu-prop .area-select-grid .field-options, #menu .menu-prop .parent-select-grid .field-options { + display: grid; + position: absolute; + height: 0; + overflow: hidden; + width: 100%; + border-radius: 0.25rem; + box-shadow: 0 2px 3px 0 #00000033; + max-height: 17rem; + z-index: 7; +} +#menu .menu-prop .area-select-grid .field-options.open, #menu .menu-prop .parent-select-grid .field-options.open { + background-color: var(--bg-3); + border: 2px solid var(--bg-4); + color: var(--text); + margin-top: 2px; + overflow: auto; + height: auto; +} +#menu .menu-prop .area-select-grid .field-options .option, #menu .menu-prop .parent-select-grid .field-options .option { + padding: 0.4rem 0.44rem; + cursor: pointer; + font-size: 0.94rem; +} +#menu .menu-prop .area-select-grid .field-options .option:hover, #menu .menu-prop .parent-select-grid .field-options .option:hover { + background-color: var(--bg-2); +} + +#menu .no-database, #menu .no-tables { + color: var(--windows-font); + border-radius: 0.4rem; +} diff -r 000000000000 -r 78edf6b517a0 .cms/css/pages.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/css/pages.css Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1664 @@ +#pages { + display: grid; + height: 100%; + grid-template-rows: auto 1fr auto; + grid-template-areas: + "main-header" + "main-main" + "main-footer"; +} + +#pages .main-header { + grid-area: main-header; + display: grid; + gap: 1rem; + min-height: 35px; +} + +@media (max-width: 1023px) { + #pages .main-header { + padding: 1rem 0.7rem 1rem 0.4rem; + grid-template-columns: 1fr auto auto auto; + } +} +@media (min-width: 1024px) { + #pages .main-header { + padding: 1rem 2.4rem 1rem 1rem; + grid-template-columns: 1fr auto 1fr auto; + } +} + +/* вернули скролл к стандартной ширине +@-moz-document url-prefix() { + #pages .main-header { + padding-right: 1.4rem; + } +} +*/ + +#pages .search-wrapper { + display: grid; + grid-template-columns: 1fr auto auto; + min-width: 180px; +} +#pages .page-search { + grid-column: 1/-1; + grid-row: 1/2; + border-radius: 0.3rem; + font-size: 0.875rem; + padding: 0 4.7rem 0 0.54rem; + height: 100%; + width: 100%; + background-color: var(--page-search); + border: 2px solid var(--input-border); + color: var(--text); +} +#pages .reset { + grid-column: 2/3; + grid-row: 1/2; + cursor: pointer; + margin: 4px; + border-radius: 50%; + outline: none; + width: 27px; + height: 27px; + background-color: transparent; + background-repeat: no-repeat; + background-position: center center; + background-size: 12px; + background-image: var(--icon-clear); +} +@media (max-width: 1023px) { + #pages .reset:active { + background-color: var(--bg-4); + } +} +@media (min-width: 1024px) { + #pages .reset:hover { + background-color: var(--bg-4); + } +} + +#pages .page-search-button { + grid-column: 3/4; + grid-row: 1/2; + border-radius: 3px; + cursor: pointer; + border: none; + outline: none; + width: 42px; + min-height: unset; + background-color: transparent; + background-repeat: no-repeat; + background-position: center center; + background-size: 48%; + background-image: var(--search-icon); +} + + +#pages .add-page-btn { + display: flex; + width: 35px; + border-radius: 0.3rem; + cursor: pointer; + background-color: var(--bg-3); + position: relative; +} +#pages .add-page-btn:hover { + background-color: var(--add-page-btn-hover); +} +#pages .add-page-btn .x1 { + width: 2px; + height: 16px; + border-radius: 2px; + position: absolute; + top: 50%; + left: 50%; + transform: rotate(0deg) translate(-50%, -50%); +} +#pages .add-page-btn .x2 { + width: 16px; + height: 2px; + border-radius: 2px; + position: absolute; + top: 50%; + left: 50%; + transform: rotate(0deg) translate(-50%, -50%); +} +#pages .add-page-btn .x1, #pages .add-page-btn .x2 { + background-color: var(--add-page-btn-svg-b-plus); +} + +#pages .add-pages { + display: grid; + grid-auto-flow: column; + column-gap: 1rem; + align-content: center; +} + +#pages .del-pages-btn { + display: grid; + cursor: pointer; + width: 35px; + border-radius: 0.3rem; + user-select: none; + background-repeat: no-repeat; + background-position: center center; + background-size: 100%; + background-image: var(--icon-trash); +} +@media (max-width: 1023px) { + #pages .add-page-btn .add-page-label { + display: none; + } +} +@media (min-width: 1024px) { + #pages .add-page-btn { + width: auto; + } + #pages .add-page-btn .add-page-label { + display: block; + width: max-content; + padding: 4px 10px 4px 10px; + background-color: var(--bg-3); + border: 2px solid var(--add-page-btn-br); + text-decoration: none; + font-size: 0.9rem; + color: var(--add-page-btn-font); + border-radius: 0.3rem; + cursor: pointer; + user-select: none; + } + #pages .add-page-btn .add-page-label:hover { + background-color: var(--bg-2); + } + #pages .add-page-btn .x1, #pages .add-page-btn .x2 { + display: none; + } + #pages .del-pages-btn:hover { + background-color: var(--bg-4); + } +} + + +#pages .main-main { + grid-area: main-main; + overflow-y: scroll; +} +@media (max-width: 1023px) { + #pages .main-main { + padding: 0 0.4rem 0.3rem 0.4rem; + } +} +@media (min-width: 1024px) { + #pages .main-main { + padding: 0rem 1rem 0.3rem 1rem; + } +} + + + + + +#pages .pages-grid { + display: grid; + row-gap: 0.3rem; +} + +#pages .pages-grid > div { + border-radius: 0.3rem; + display: grid; + padding: 0.7rem; + column-gap: 0.7rem; + box-shadow: var(--shadows); + position: relative; + row-gap: 0.5rem; + background-color: var(--windows); + background-image: var(--noise); +} +@media (max-width: 1023px) { + #pages .pages-grid > div { + grid-template-areas: + "page-name page-pin page-del" + "page-butt published page-del"; + grid-template-columns: 1fr auto 1.4rem; + } +} +@media (min-width: 1024px) { + #pages .pages-grid > div { + grid-template-areas: + "page-name page-pin page-date page-del" + "page-butt published page-date page-del"; + grid-template-columns: 1fr auto 6rem 1.4rem; + } + #pages .pages-grid > div:hover { + background-color: var(--windows-hover) + } +} +#pages .pages-grid > div.open { + background-color: var(--pages-grid-div-open); + box-shadow: 0 0 0 2px var(--pages-grid-div-open-shadow) inset; +} + +#pages .pages-grid > div.home { + box-shadow: 0 0 0 2px var(--pages-grid-div-open-shadow) inset; +} +#pages .pages-grid > div[data-published="0"] { + box-shadow: 0 0 0 2px var(--hidden) inset; +} + +@media (max-width: 1023px) { + #pages .pages-grid > div.open { + grid-template-areas: + "page-name page-pin page-del " + "page-butt published page-del " + "page-prop page-prop page-prop"; + } +} +@media (min-width: 1024px) { + #pages .pages-grid > div.open { + grid-template-areas: + "page-name page-pin page-date page-del " + "page-butt published page-date page-del " + "page-prop page-prop page-prop page-prop"; + } +} + + +#pages .pages-grid > div.last-edited::before { + content: ""; + position: absolute; + left: 3px; + top: 3px; + z-index: 1; + width: 7px; + height: 7px; + border-radius: 50%; + background-color: var(--green-3); +} + +#pages .pin { + grid-area: page-pin; + width: 15px; + height: 15px; + margin: -11px auto 0 auto; + cursor: pointer; + background-repeat: no-repeat; + background-position: center center; + background-size: 84%; + background-image: var(--pages-pin-off); +} +#pages [data-pin="1"] .pin { + background-image: var(--pages-pin-on); +} +@media (min-width: 1024px) { + #pages .pages-grid > div .pin { + display: none; + } + #pages .pages-grid > div[data-pin="1"] .pin { + display: block; + } + #pages .pages-grid > div:hover .pin { + display: block; + } +} + +#pages .pages-grid > div > .published { + grid-area: published; + width: 18px; + height: 18px; + cursor: pointer; + background-size: 100%; + background-position: center; + background-repeat: no-repeat; + background-image: var(--eye-on); + grid-row: 2/3; + align-self: end; +} +#pages .pages-grid [data-published="0"] .published { + background-image: var(--eye-off); +} +@media (min-width: 1024px) { + #pages .pages-grid > div > .published { + opacity: 0; + } + #pages .pages-grid > div.open > .published { + opacity: 1; + } + #pages .pages-grid > div:hover .published { + opacity: 1; + } + #pages .pages-grid [data-published="0"] .published { + opacity: 1; + } +} + + +.page-buttons div { + cursor: pointer; + user-select: none; + color: var(--buttons-font); + position: relative; +} +.page-buttons .loading::after { + content: ""; + display: block; + width: 100%; + height: 2px; + position: absolute; + left: 0; + right: 0; + bottom: -3px; + border-radius: 2px; + background-image: repeating-linear-gradient(90deg, var(--link) -0.2rem, var(--windows) 0rem, var(--link) 0.2rem); + animation: barberpole 10s linear infinite; + background-size: 300% 300%; +} +@keyframes barberpole { + 100% { + background-position: 150% 150%; + } +} + + +.page-buttons div:hover { + color: var(--buttons-hover); +} +.pages-grid > div.open .page-prop-btn { + color: var(--buttons-open); +} + +.page-prop-save-btn { + display: none; +} +.pages-grid > div.open .page-prop-save-btn { + display: block; +} +.pages-grid > div.open .page-prop-save-btn.saved { + color: var(--saved); +} + +.pages-grid a.page-name { + grid-area: page-name; + width: fit-content; + display: flex; + margin-top: -5px; + font-size: 1rem; + min-height: 21px; /* for empty title */ + text-decoration: none; + color: var(--link); + font-weight: 600; +} +.pages-grid a.page-name:hover { + color: var(--link-hover); +} + + +.page-buttons { + grid-area: page-butt; + display: flex; + column-gap: 0.7rem; + font-size: 0.9rem; +} +@media (max-width: 320px) { + .page-buttons { + font-size: 0.7rem; + align-self: center; + } +} +@media (min-width: 1024px) { + .page-buttons { + opacity: 0; + } + .pages-grid > div:hover .page-buttons { + opacity: 1; + } + .pages-grid > div.open .page-buttons { + opacity: 1; + } +} +@media (max-width: 1023px) { + .page-date { + display: none; + } +} +@media (min-width: 1024px) { + .page-date { + grid-area: page-date; + display: flex; + justify-content: center; + align-items: center; + font-size: 0.8rem; + color: var(--page-date); + } + .page-date.future { + color: var(--page-date-planned); + } +} + +#pages .page-prop { + display: none; + grid-area: page-prop; +} +@media (max-width: 1023px) { + #pages .pages-grid > div.open .page-prop { + display: grid; + } +} +@media (min-width: 1024px) { + #pages .page-prop, #pages .page-properties { + grid-template-areas: + "cTitle vTitle cTemplate vTemplate" + "cURL vURL cDate vDate" + "cSEO vSEO cTime vTime" + "cDesc vDesc cTags vTags"; + grid-template-columns: 6em minmax(240px, 100%) 6em minmax(240px, 100%); + row-gap: 0.75rem; + column-gap: 0.7rem; + } + #pages .pages-grid > div.open .page-prop { + display: grid; + padding: 0.5rem 0 0.3rem 0; + } +} + +#pages .page-prop > .title, #pages .page-properties > .title { + font-size: 1rem; + line-height: 27px; + color: var(--names); +} + + +/* Select */ +#pages .page-prop .template-select-grid, #pages .page-properties .template-select-grid { + position: relative; +} +#pages .page-prop .field-select, #pages .page-properties .field-select { + display: grid; + grid-template-columns: 1fr 28px; + height: 100%; + min-height: 30px; + cursor: pointer; + background-color: var(--bg-4); + border: 1px solid var(--bg-4); + border-radius: 4px; + user-select: none; +} +#pages .page-prop .field-select > .value, +#pages .page-properties .field-select > .value { + padding: 0 0 0 0.44rem; + white-space: nowrap; + overflow: hidden; + line-height: 26px; + font-size: 0.94rem; + color: var(--text); +} +#pages .page-prop .field-select > .icon, +#pages .page-properties .field-select > .icon { + background-image: var(--select-icon); + background-repeat: no-repeat; + background-position: center; + background-size: 12px; +} + + +#pages .page-prop .template-select-grid .field-options, #pages .page-properties .template-select-grid .field-options { + display: grid; + position: absolute; + height: 0; + overflow: hidden; + width: 100%; + border-radius: 0.25rem; + box-shadow: 0 2px 3px 0 #00000033; + max-height: 17rem; + z-index: 7; +} +#pages .page-prop .template-select-grid .field-options.open, #pages .page-properties .template-select-grid .field-options.open { + background-color: var(--bg-3); + border: 2px solid var(--bg-4); + margin-top: 2px; + color: var(--text); + overflow: auto; + height: auto; +} +#pages .page-prop .template-select-grid .field-options .option, #pages .page-properties .template-select-grid .field-options .option { + padding: 0.4rem 0.44rem; + cursor: pointer; + font-size: 0.94rem; +} +#pages .page-prop .template-select-grid .field-options .option:hover, #pages .page-properties .template-select-grid .field-options .option:hover { + background-color: var(--bg-2); +} + +@media (max-width: 1023px) { + #pages .page-prop > .title:not(:first-child), #pages .page-properties > .title:not(:first-child) { + padding-top: 0.75rem; + } +} +@media (min-width: 1024px) { + #pages .page-prop > .title, #pages .page-properties > .title { + text-align: right; + } + #pages .page-prop .page.title, #pages .page-properties .page.title { grid-area: cTitle; } + #pages .page-prop input[name=title], #pages .page-properties input[name=title] { grid-area: vTitle; } + #pages .page-prop .seo.title, #pages .page-properties .seo.title { grid-area: cSEO; } + #pages .page-prop input[name=seo_title], #pages .page-properties input[name=seo_title] { grid-area: vSEO; } + #pages .page-prop .url.title, #pages .page-properties .url.title { grid-area: cURL; } + #pages .page-prop .url-input, #pages .page-properties .url-input { grid-area: vURL; } + #pages .page-prop .template.title, #pages .page-properties .template.title { grid-area: cTemplate; } + #pages .page-prop .template-select-grid, .page-properties .template-select-grid { grid-area: vTemplate; } + #pages .page-prop .description.title, #pages .page-properties .description.title { grid-area: cDesc; } + #pages .page-prop textarea[name="description"], #pages .page-properties textarea[name="description"] { grid-area: vDesc; } + #pages .page-prop .date.title, #pages .page-properties .date.title { grid-area: cDate; } + #pages .page-prop input[name=date], .page-properties input[name=date] { grid-area: vDate; max-width: fit-content; } + #pages .page-prop .time.title, #pages .page-properties .time.title { grid-area: cTime; } + #pages .page-prop input[name=time], #pages .page-properties input[name=time] { grid-area: vTime; max-width: fit-content; } + #pages .page-prop .tags.title, #pages .page-properties .tags.title { grid-area: cTags; } + #pages .page-prop textarea[name="tags"], #pages .page-properties textarea[name="tags"] { grid-area: vTags; } +} + + +.page-prop .url-input { + display: grid; + grid-template-columns: 1fr 2.7rem; +} +@media (max-width: 1023px) { + .page-prop > .url-input:not(:first-child), .page-prop > .template-select-grid:not(:first-child) { + padding-top: 0; + } +} + +.page-prop .url-input > input { + width: 100%; + grid-column: 1/-1; + grid-row: 1/-1; + padding-right: 3rem; +} +.page-prop .url-input .url-translit { + display: grid; + grid-column: 2/3; + grid-row: 1/-1; + cursor: pointer; + background-repeat: no-repeat; + background-position: center center; + background-size: 54%; + background-image: var(--icon-link); +} + + +.pages-grid > div > input[type="checkbox"] { + grid-area: page-del; +} +@media (min-width: 1024px) { + .pages-grid > div > input[type="checkbox"] { + align-self: center; + } +} + +.page-prop input, +.page-prop textarea{ + border-radius: 4px; + font-size: 0.94rem; + padding: 0 0.54rem; + min-height: 30px; + height: 100%; + background-color: var(--bg-4); + border: 1px solid var(--bg-4); + color: var(--text); +} + +.page-prop textarea { + font-family: var(--sans-serif); + line-height: 1.3em; + resize: vertical; + display: block; +} + +.page-prop select, .page-prop input[type=date], .page-prop input[type=time] { + -moz-padding-start: 4px; + -moz-padding-end: 4px; +} + +#pages .main-footer { + grid-area: main-footer; + padding: 1rem; + display: grid; + column-gap: 1rem; + grid-auto-flow: column; + justify-content: space-between; +} + +#pages .main-footer .pager::-webkit-scrollbar { + height: 0; +} + +#pages .main-footer .pager { + scrollbar-width: none; +} + +#pages .counters { + display: grid; + column-gap: 0.5rem; + grid-auto-flow: column; +} +#pages .counters input { + border-radius: 4px; + font-size: 0.875rem; + padding: 0 0.3rem; + min-height: 30px; + height: 100%; + width: 3.2rem; + text-align: center; + background-color: var(--bg-4); + border: 1px solid var(--bg-4); + color: var(--text); +} +#pages .counters span { + display: flex; + align-items: center; + font-size: 0.875rem; + color: var(--text); +} + + +#pages .main-footer .pager { + display: grid; + grid-auto-flow: column; + column-gap: 0.5rem; + overflow-x: auto; + padding: 4px; +} + +#pages .main-footer .pager > div { + color: var(--text); + background-color: var(--bg-3); + display: flex; + justify-content: center; + align-items: center; + min-width: 32px; + border-radius: 0.7rem; + font-size: 0.875rem; + cursor: pointer; + user-select: none; +} + +#pages .main-footer .pager > div.active { + color: var(--main-footer-pager-div-active-font); + box-shadow: 0 0 0 0.25rem var(--pages-main-footer-pager-div-bg-active); +} + +#pages .main-footer .pager > div:hover { + color: var(--main-footer-pager-div-hover); +} + +#pages .page-editor-bg { + display: grid; + position: relative; + grid-row: 1/-1; + grid-column: 1/-1; + z-index: 9; + background-color: var(--bg-3); + background-image: var(--noise); +} +@media (min-width: 1024px) { + #pages .page-editor-bg { + padding: 1rem; + } +} +#pages .page-editor-bg.hidden { + display: none; +} + + +#pages .page-editor-grid { + position: relative; + background-color: var(--bg-3); + box-shadow: 0 0 3px 0 #00000096; + min-height: 0; /*Scroll*/ + display: grid; + grid-template-rows: auto auto auto auto 1fr 1rem; + grid-template-areas: + "page-editor-header page-editor-header" + "page-editor-buttons page-editor-buttons" + "page-properties page-properties" + "page-editor-panel page-editor-panel" + "page-editor tags" + "bottom bottom"; +} + +#pages .page-editor-grid::before { + content: ""; + position: absolute; + left: 3px; + top: 3px; + z-index: 1; + width: 7px; + height: 7px; + border-radius: 50%; + +} + +#pages .page-editor-grid[data-changed="true"]::before { + background-color: var(--changes); +} + + + + + + + + + + +#pages .page-properties { + grid-area: page-properties; + display: grid; + padding: 0.5rem 0.5rem 1rem 0.5rem; +} + +@media (max-width: 414px) { + #pages .page-properties { + grid-row: 3/-1; + z-index: 111; + background-color: var(--bg-3); + align-content: start; + overflow-y: auto; + } +} + + + + +#pages .page-properties.hidden { + display: none; +} + + +/* Options */ +#pages .page-properties select { + appearance: none; + background-repeat: no-repeat; + background-position: right .37rem center; + background-size: 16px 12px; +} + +#pages .page-properties select { + background-image: var(--select-icon); +} + + + +#pages .page-properties .url-input { + display: grid; + grid-template-columns: 1fr 2.7rem; +} +#pages .page-properties .url-input > input { + width: 100%; + grid-column: 1/-1; + grid-row: 1/-1; + padding-right: 3rem; +} +#pages .page-properties .url-input .url-translit { + display: grid; + grid-column: 2/3; + grid-row: 1/-1; + cursor: pointer; + background-repeat: no-repeat; + background-position: center center; + background-size: 54%; + background-image: var(--icon-link); +} + +#pages .page-properties input, +#pages .page-properties textarea { + border-radius: 4px; + font-size: 0.94rem; + padding: 0 0.54rem; + min-height: 30px; + height: 100%; + background-color: var(--bg-4); + border: 1px solid var(--bg-4); + color: var(--text); +} + +#pages .page-properties textarea { + font-family: var(--sans-serif); + font-size: 0.94rem; + line-height: 1.3em; + resize: vertical; + min-height: 3.75rem; +} + +#pages .page-properties select, #pages .page-properties input[type=date], #pages .page-properties input[type=time] { + -moz-padding-start: 4px; + -moz-padding-end: 4px; +} + + + + + + + + + + + + + + + + + + + + +@media (max-width: 1023px) { + #pages .page-editor-grid { + grid-template-columns: 1fr 0; + } + #pages .page-editor-grid.tags-opened { + grid-template-columns: 1fr max-content; + } + #pages .tags { + z-index: 3; + } +} +@media (min-width: 1024px) { + #pages .page-editor-grid { + grid-template-columns: 1fr 0; + } + #pages .page-editor-grid.tags-opened { + grid-template-columns: 1fr max-content; + } +} +@media (min-width: 1024px) { + #pages .page-editor-grid { + border-radius: 5px; + } +} + +#pages .page-editor-header { + grid-area: page-editor-header; + display: grid; +} +@media (max-width: 1023px) { + #pages .page-editor-header { + grid-template-areas: + "close title"; + grid-template-columns: auto 1fr; + column-gap: 1rem; + row-gap: 0.5rem; + padding: 10px 10px 0 10px; + } +} +@media (min-width: 1024px) { + #pages .page-editor-header { + padding: 10px 10px 0 10px; + grid-template-columns: max-content 1fr; + column-gap: 1rem; + } +} + +#pages .close-page-button { + position: relative; + cursor: pointer; + width: 2rem; + height: 2rem; + border-radius: 3px; + background-color: var(--bg-3); + background-repeat: no-repeat; + background-position: center center; + background-size: 40%; + background-image: var(--icon-close); +} +#pages .close-page-button:hover { + background-color: var(--bg-4); +} +@media (max-width: 1023px) { + #pages .close-page-button { + grid-area: close; + } +} + +#pages .save-page-button { + cursor: pointer; + user-select: none; +} + +#pages .page-editor-buttons .save-page-button.saved { + color: var(--saved); +} +#pages .page-editor-buttons .save-page-button.error { + color: var(--error); +} + + +#pages .open-properties { + cursor: pointer; + user-select: none; +} +#pages .page-editor-grid.properties .open-properties { + color: var(--buttons-open); +} + +#pages .page-editor-header a { + color: var(--link); + text-decoration: none; + width: fit-content; + align-self: center; + font-weight: 600; +} +#pages .page-editor-header a:hover { + color: var(--link-hover); + text-decoration: none; +} + +@media (max-width: 1023px) { + .page-editor-title { + grid-area: title; + } +} + +#pages .page-editor-buttons { + display: grid; + grid-area: page-editor-buttons; + grid-auto-flow: column; + gap: 0.7em; + justify-content: start; + overflow-x: auto; + overflow-y: hidden; + font-size: 1rem; + color: var(--buttons-font); +} +@media (max-width: 1023px) { + #pages .page-editor-buttons { + padding: 10px 10px; + } +} +@media (min-width: 1024px) { + #pages .page-editor-buttons { + padding: 10px 14px; + } + #pages .page-editor-buttons > div:hover { + color: var(--buttons-hover); + } +} +#pages .page-editor-buttons.hidden { + display: none; +} + + +#pages .open-mediateka { + cursor: pointer; + user-select: none; +} +#pages .page-editor-grid.mediateka .open-mediateka { + color: var(--buttons-open); +} + + +#pages .tags-helper { + cursor: pointer; + user-select: none; +} +#pages .page-editor-grid.tags-opened .tags-helper { + color: var(--buttons-open); +} + + +#pages .codemirror-replace { + cursor: pointer; + user-select: none; +} + + +#pages .page-editor-buttons a { + color: var(--uni-editor); + text-decoration: none; +} +@media (min-width: 1024px) { + #pages .page-editor-buttons a:hover { + color: var(--buttons-hover); + } +} + + +#pages .page-editor-panel { + display: grid; + grid-area: page-editor-panel; + padding:10px; + position: relative; + max-width: 100%; +} +#pages .page-editor-panel.hidden { + display: none; +} + +#pages .upload-progress { + position: absolute; + width: 0%; + height: 3px; + background-color: tomato; +} +@keyframes barberpole { + 100% { + background-position: 100% 100%; + } +} + +#pages .mediateka-grid { + display: grid; + grid-template-rows: auto auto; + grid-template-columns: 1fr; + row-gap: 10px; + grid-template-areas: + "mediateka-files-hscroll" + "mediateka-buttons"; +} +#pages .mediateka-grid.hidden { + display: none; +} + +#pages .mediateka-files-hscroll { + grid-area: mediateka-files-hscroll; + overflow-x: auto; + overflow-y: hidden; + padding-bottom: 4px; +} + +#pages .mediateka-files-grid { + display: grid; + column-gap: 5px; + grid-auto-columns: 130px; + grid-auto-flow: column; +} + +#pages .file-block { + height: 130px; + background-color: var(--bg-2); + box-shadow: 0 2px 3px 0 #0000004d; + border: 2px solid var(--br-3); + border-radius: 8px; + overflow: hidden; + position: relative; +} + +#pages .file-block:hover { + border: 2px solid var(--br-active); +} +#pages .file-block.active-file { + border: 2px solid var(--br-active); +} + +#pages .file-block img { + object-fit: contain; + width: 100%; + height: 100%; + display: block; +} + +#pages .file-block .media-name { + width: 100%; + font-size: 60%; + position: absolute; + padding: 0 2%; + overflow: hidden; + color: var(--text); + word-break: break-all; + background-color: #0005; +} + +#pages .file-block input[type="checkbox"] { + position: absolute; + right: 3px; + top: 5px; + z-index: 1; + width: 1rem; + height: 1rem; + display: none; + border-color: var(--orange); +} + +#pages .file-block:hover input[type="checkbox"] { + display: block; +} + +#pages .file-block input[type="checkbox"]:checked { + display: block; +} + +#pages .file-block .ext { + position: absolute; + z-index: 12; + bottom: 3px; + left: 3px; + font-size: 12px; + padding: 1px 5px 1px 3px; + border-radius: 3px; + cursor: default; + background-color: var(--bg-4); + color: var(--ext); +} + +#pages .mediateka-buttons { + display: grid; + grid-area: mediateka-buttons; +} +@media (max-width: 1023px) { + #pages .mediateka-buttons { + grid-template-rows: auto; + grid-template-columns: 1fr 1fr; + gap: 0.9rem; + grid-template-areas: + "upload-files del-uploaded-files" + "link-file link-file"; + } +} +@media (min-width: 1024px) { + #pages .mediateka-buttons { + grid-template-columns: auto 1fr auto; + column-gap:15px; + grid-template-areas: "upload-files link-file del-uploaded-files"; + } +} +#pages .upload-files { + grid-area: upload-files; + min-height: 2.5rem; + position: relative; + background-color: var(--bg-2); + user-select: none; + +} +#pages .mediateka-buttons .inputfile { + width: 100%; + opacity: 0; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + overflow: hidden; +} +#pages .mediateka-buttons .inputfile + label { + height: 100%; + padding: 11px 10px 0 10px; + display: flex; + cursor: pointer; + justify-content: center; + border-radius: 4px; + font-size: 1rem; + line-height: 1; + color: var(--buttons-font); +} + +#pages .link-file { + grid-area: link-file; + display: grid; + grid-template-columns: 1fr auto; + column-gap: 1rem; + line-height: 2; + min-height: 2.5rem; + align-items: center; + padding-left: 10px; + padding-right: 4px; + border-radius: 5px; + font-size: 1rem; + word-break: break-all; + background-color: var(--bg-2); + color: var(--buttons-font); +} +#pages .link-file a { + color: var(--link); + text-decoration: none; + border-bottom: 1px dashed; +} +#pages .link-file-tag { + line-height: 1.4; +} +#pages .link-file-copy-btn { + cursor: pointer; + z-index: 1; + font-size: 0.8rem; + padding: 0 0.4rem 1px 0.4rem; + border-radius: 0.2rem; + display: flex; + min-height: 2rem; + height: calc(100% - 8px); + user-select: none; + justify-content: center; + align-items: center; + background-color: var(--bg-3); +} + +#pages .del-uploaded-files { + grid-area: del-uploaded-files; + display: flex; + justify-content: center; + align-items: center; + padding: 0 10px 2px 10px; + border-radius: 4px; + font-size: 1rem; + cursor: pointer; + line-height: 1; + background-color: var(--orange); + color: var(--white); + user-select: none; +} +#pages .del-uploaded-files:hover { + box-shadow: 0 0 0 0.25rem var(--focus-orange); +} + +#pages .del-uploaded-files.disabled { + background-color: var(--bg-2); + color: var(--font-bg); + cursor: context-menu; +} +#pages .del-uploaded-files.disabled:hover { + box-shadow: unset; +} + +/* теги, в которые заворачивается html-код */ +#pages .page-editor-grid > .tags { + grid-area: tags; + display: none; + width: max-content; + overflow-y: auto; + background-color: var(--tags-bg); + position: relative; + scrollbar-width: none; +} +#pages .page-editor-grid > .tags::-webkit-scrollbar { + display: none; +} +#pages .page-editor-grid.tags-opened > .tags { + display: block; +} + +#pages .tags-grid { + display: grid; + position: relative; + padding: 0.3rem 0; +} + +#pages .tags-grid > div { + display: flex; + padding: 7px 15px 7px 15px; + color: var(--tags-font); + font-size: 0.9rem; + cursor: pointer; + justify-content: space-between; +} + +#pages .tags-grid > div .tag { + color: var(--windows-font); +} +#pages .tags-grid > div:hover { + background-color: var(--codemirror-bg); +} + +#pages .no-database, #pages .no-tables { + color: var(--windows-font); + border-radius: 0.4rem; +} + + +#pages .page-editor { + grid-area: page-editor; +} +@media (max-width: 1023px) { + #pages .page-editor { + grid-column: 1/-1; + } +} +body .CodeMirror { + min-height: 100%; + max-height: 100%; + height: 2rem; + font-family: var(--monospace); + font-weight: normal; + font-size: 1.04rem; +} +body .CodeMirror-dialog input { + font-family: var(--monospace); + font-size: 100%; +} + +body .CodeMirror-wrap pre.CodeMirror-line, body .CodeMirror-wrap pre.CodeMirror-line-like { + word-wrap: break-word; + white-space: pre-wrap; + word-break: break-all; +} + +/* Codemirror dark and light theme Start */ +.cm-s-default.CodeMirror { + background-color: var(--codemirror-bg); + color: var(--codemirror-text); +} +.cm-s-default .CodeMirror-gutters { + background-color: var(--codemirror-bg); + color: var(--codemirror-numbeslines); + border: none; +} +/* Codemirror light theme Start */ +.light .CodeMirror .CodeMirror-guttermarker, +.light .CodeMirror .CodeMirror-guttermarker-subtle, +.light .CodeMirror .CodeMirror-linenumber { + color: var(--codemirror-numbeslines); +} +.light .CodeMirror .CodeMirror-cursor { + border-left: 2px solid #ff5100; +} +.light .CodeMirror div.CodeMirror-selected { + background-color: #0663d2; +} +.light .CodeMirror .cm-searching { + background-color: rgb(112 112 100 / 30%); +} +.light .CodeMirror-focused div.CodeMirror-selected { + background-color: #0663d2; +} +.light .CodeMirror .CodeMirror-line::selection, +.light .CodeMirror .CodeMirror-line>span::selection, +.light .CodeMirror .CodeMirror-line>span>span::selection { + background-color: rgba(128, 203, 196, 0.2); +} +.light .CodeMirror .CodeMirror-line::-moz-selection, +.light .CodeMirror .CodeMirror-line>span::-moz-selection, +.light .CodeMirror .CodeMirror-line>span>span::-moz-selection { + background-color: rgba(128, 203, 196, 0.2); +} +.light .CodeMirror .CodeMirror-activeline-background { + background-color: #f5f1efb5; +} +.light .CodeMirror .cm-keyword { + color: #C792EA; +} +.light .CodeMirror .cm-operator { + color: #00a5e8; +} +.light .CodeMirror .cm-variable-2 { + color: #373737; +} +.light .CodeMirror .cm-variable-3, +.light .CodeMirror .cm-type { + color: #f07178; +} +.light .CodeMirror .cm-builtin { + color: #ffa706; +} +.light .CodeMirror .cm-atom { + color: #F78C6C; +} +.light .CodeMirror .cm-number { + color: #FF5370; +} +.light .CodeMirror .cm-def { + color: #03A9F4; +} +.light .CodeMirror .cm-string { + color: #71b199; +} +.light .CodeMirror .cm-string-2 { + color: #f07178; +} +.light .CodeMirror .cm-comment { + color: #546E7A; +} +.light .CodeMirror .cm-variable { + color: #f07178; +} +.light .CodeMirror .cm-tag { + color: #b6745c; +} +.light .CodeMirror .cm-meta { + color: #ff7600; +} +.light .CodeMirror .cm-attribute { + color: #C792EA; +} +.light .CodeMirror .cm-property { + color: #373737; +} +.light .CodeMirror .cm-qualifier { + color: #c868e9; +} +.light .CodeMirror .cm-variable-3, +.light .CodeMirror .cm-type { + color: #f71d1d; +} +.light .CodeMirror .cm-error { + color: rgba(255, 255, 255, 1.0); + background-color: #FF5370; +} +.light .CodeMirror .CodeMirror-matchingbracket { + text-decoration: underline; + color: #0004ff !important; +} +/* Codemirror dark theme Start */ +.dark .CodeMirror .CodeMirror-guttermarker, +.dark .CodeMirror .CodeMirror-guttermarker-subtle, +.dark .CodeMirror .CodeMirror-linenumber { + color: var(--codemirror-numbeslines); +} +.dark .CodeMirror .CodeMirror-cursor { + border-left: 2px solid #FFCC00; +} +.dark .CodeMirror div.CodeMirror-selected { + background-color: #0663d2; +} +.dark .CodeMirror .cm-searching { + background-color: rgb(112 112 100 / 30%); +} +.dark .CodeMirror-focused div.CodeMirror-selected { + background-color: #0663d2; +} +.dark .CodeMirror .CodeMirror-line::selection, +.dark .CodeMirror .CodeMirror-line>span::selection, +.dark .CodeMirror .CodeMirror-line>span>span::selection { + background-color: rgba(128, 203, 196, 0.2); +} +.dark .CodeMirror .CodeMirror-line::-moz-selection, +.dark .CodeMirror .CodeMirror-line>span::-moz-selection, +.dark .CodeMirror .CodeMirror-line>span>span::-moz-selection { + background-color: rgba(128, 203, 196, 0.2); +} +.dark .CodeMirror .CodeMirror-activeline-background { + background-color: #2c2929b5; +} +.dark .CodeMirror .cm-keyword { + color: #C792EA; +} +.dark .CodeMirror .cm-operator { + color: #89DDFF; +} +.dark .CodeMirror .cm-variable-2 { + color: #EEFFFF; +} +.dark .CodeMirror .cm-variable-3, +.dark .CodeMirror .cm-type { + color: #f07178; +} +.dark .CodeMirror .cm-builtin { + color: #FFCB6B; +} +.dark .CodeMirror .cm-atom { + color: #F78C6C; +} +.dark .CodeMirror .cm-number { + color: #FF5370; +} +.dark .CodeMirror .cm-def { + color: #82AAFF; +} +.dark .CodeMirror .cm-string { + color: #94af6e; +} +.dark .CodeMirror .cm-string-2 { + color: #f07178; +} +.dark .CodeMirror .cm-comment { + color: #546E7A; +} +.dark .CodeMirror .cm-variable { + color: #f07178; +} +.dark .CodeMirror .cm-tag { + color: #FF5370; +} +.dark .CodeMirror .cm-meta { + color: #FFCB6B; +} +.dark .CodeMirror .cm-attribute { + color: #C792EA; +} +.dark .CodeMirror .cm-property { + color: #C792EA; +} +.dark .CodeMirror .cm-qualifier { + color: #DECB6B; +} +.dark .CodeMirror .cm-variable-3, +.dark .CodeMirror .cm-type { + color: #DECB6B; +} +.dark .CodeMirror .cm-error { + color: rgba(255, 255, 255, 1.0); + background-color: #FF5370; +} +.dark .CodeMirror .CodeMirror-matchingbracket { + text-decoration: underline; + color: white !important; +} +/* Codemirror dark theme End. */ + + +#lbox-window { + position: fixed; + z-index: 999; + cursor: pointer; + background-color: var(--lbox-window); + display: grid; + height: 100vh; + width: 100vw; + grid-template-areas: "lightbox"; +} +#lbox-window img, #lbox-window video, #lbox-window audio { + max-width: 100%; + max-height: 100%; + box-shadow: 0 3px 7px 0 #0000004d; + grid-area: lightbox; + align-self: center; + justify-self: center; + overflow: hidden; +} + +#lbox-window audio { + width: 97%; + height: 54px; +} + + + + + + +/* Pages Utils */ + +#pages-utils { + display: grid; + gap: 1rem; + overflow-y: auto; + max-height: 100%; +} + +@media (max-width: 1023px) { + #pages-utils { + padding: 1rem 0.4rem 1rem 0.4rem; + } +} + +@media (min-width: 1024px) { + #pages-utils { + padding: 1rem; + } +} + +#pages-utils .pages-utils-main { + background-color: var(--windows); + background-image: var(--noise); + box-shadow: var(--shadows); + border-radius: 0.3rem; +} +@media (max-width: 1023px) { + #pages-utils .pages-utils-main { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #pages-utils .pages-utils-main { + padding: 1rem; + } +} + +#pages-utils .replace-util { + display: grid; + gap: 1rem; +} +#pages-utils .replace-util > p { + color: var(--text); + font-size: 1rem; +} + +#pages-utils .replace-inputs { + display: grid; +} +@media (max-width: 1023px) { + #pages-utils .replace-inputs { + gap: 0.5rem; + } +} +@media (min-width: 1024px) { + #pages-utils .replace-inputs { + grid-template-columns: 1fr 1fr; + gap: 1rem; + } +} + +#pages-utils .regex, #pages-utils .replace, #pages-utils .replace_id_col, #pages-utils .replace_column, #pages-utils .replace_table { + display: grid; + row-gap: 0.2rem; +} + +#pages-utils .regex .title, #pages-utils .replace .title, #pages-utils .replace_id_col, #pages-utils .replace_column, #pages-utils .replace_table { + font-size: 1rem; + color: var(--windows-font); +} + + +#pages-utils .replace-inputs input { + border-radius: 4px; + font-size: 0.875rem; + padding: 0 0.54rem; + min-height: 35px; + width: 100%; + color: var(--input-font); + background-color: var(--input-bg); + border: 2px solid var(--input-border); +} + +#pages-utils .replace-btn { + width: fit-content; + display: flex; + justify-content: center; + align-items: center; + padding: 0.44rem 0.74rem 0.47rem 0.74rem; + min-height: 35px; + border-radius: 0.25rem; + background-color: var(--button-bg); + border: 1px solid var(--button-border); + color: var(--windows-font); + font-size: 0.875rem; + cursor: pointer; +} \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/css/rss.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/css/rss.css Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,232 @@ +#rss { + display: grid; + height: 100%; + overflow-y: auto; + grid-auto-rows: max-content; + row-gap: 1rem; +} +#rss form { + display: grid; + gap: 1rem; +} + +@media (max-width: 1023px) { + #rss { + padding: 1rem 0.4rem 1rem 0.4rem; + display: flex; /*Samsung Browser - padding-bottom*/ + flex-direction: column; /*Samsung Browser - padding-bottom*/ + } + #rss form { + grid-template-columns: 1fr; + grid-template-areas: + "xml-wrapper-hidden" + "xml-static-dynamic" + "xml-static-cron"; + } +} +@media (min-width: 1024px) { + #rss { + padding: 1rem; + } + #rss form { + grid-template-columns: 1fr 1fr; + grid-template-areas: + "xml-wrapper-hidden xml-static-dynamic" + "xml-wrapper-hidden xml-static-cron"; + } +} + +@media (min-width: 1024px) { + #rss .xml-wrapper-hidden { + grid-area: xml-wrapper-hidden; + } + #rss .xml-static-dynamic { + grid-area: xml-static-dynamic; + } + #rss .xml-static-cron { + grid-area: xml-static-cron; + } +} + +#rss .xml-wrapper-hidden, #rss .xml-static-dynamic, #rss .xml-static-cron { + display: grid; + grid-auto-rows: max-content; + row-gap: 0.7rem; + box-shadow: var(--shadows); + border-radius: 0.3rem; + background-color: var(--windows); + background-image: var(--noise); +} +.xml-wrapper-hidden div, .xml-static-dynamic div, .xml-static-cron div { + color: var(--windows-font); +} + +@media (max-width: 1023px) { + #rss .xml-wrapper-hidden, #rss .xml-static-dynamic, #rss .xml-static-cron { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #rss .xml-wrapper-hidden, #rss .xml-static-dynamic, #rss .xml-static-cron { + padding: 1rem; + } +} + +#rss textarea { + line-height: 1.3em; + resize: vertical; + width: 100%; + background-color: var(--input-bg); + border: 2px solid var(--input-border); + border-radius: 4px; + font-family: var(--monospace); + font-size: 1rem; + color: var(--input-font); + padding: 0 8px; + min-height: 30px; +} + +#rss form div > input { + border-radius: 4px; + font-size: 0.875rem; + padding: 0 0.54rem; + min-height: 35px; + width: 100%; + color: var(--input-font); + background-color: var(--input-bg); + border: 2px solid var(--input-border); +} + +#rss form div > button { + width: fit-content; +} + +#rss .save_2_col { + display: grid; +} +#rss .save_2_col > button { + grid-area: button; +} +#rss .save_2_col > div { + grid-area: div; +} +@media (max-width: 767px) { + #rss .save_2_col { + grid-template-columns: 1fr; + row-gap: 0.7rem; + } + #rss .save_2_col { + grid-template-areas: + "div" + "button"; + } +} +@media (min-width: 768px) { + #rss .save_2_col { + grid-template-areas: + "button div"; + grid-template-columns: auto 1fr; + column-gap: 1rem; + } +} + +#rss .select-dropdown { + position: relative; +} +#rss .select-dropdown ul.list-search { + height: 0; + background-color: var(--bg-3); + display: grid; + margin: 0; + margin-top: 2px; + padding: 0; + overflow-y: auto; + max-height: 17rem; + overscroll-behavior: contain; + position: absolute; + width: 100%; + border-radius: 4px; +} +#rss .select-dropdown.open ul.list-search { + height: auto; + border: 2px solid var(--bg-4); +} +#rss .select-dropdown .list-search li { + display: block; + list-style-type: none; + padding: 0.4rem 0.44rem; + cursor: pointer; + font-size: 0.94rem; + text-align: left; +} +#rss .select-dropdown .list-search li:hover { + background-color: var(--menu-item-list-search-li-hover-active); +} + +#rss .xml-static-dynamic input[type="text"] { + color: var(--input-font); +} +#rss .xml-static-dynamic label input[type="radio"] { + cursor: pointer; + display: inline-block; + margin-right: 0.3rem; + border-radius: 50%; + width: 0.73rem; + height: 0.73rem; + background-color: var(--bg-4); + transform: translate(0, 0); + appearance: none; +} +#rss .xml-static-dynamic label input:checked { + background-color: var(--orange); + border-color: var(--orange); + box-shadow: 0 0 0 0.25rem var(--focus-orange); +} + +#rss .xml-static-dynamic label { + cursor: pointer; + line-height: 1.1em; + font-size: 1rem; + color: var(--link); + user-select: none; +} + +#rss .xml-static-cron p, #rss .xml-static-dynamic p { + font-size: 1rem; + color: var(--text); +} +#rss .xml-static-cron input[type="text"], #rss .xml-static-dynamic input[type="text"] { + max-width: 70px; + border-radius: 4px; + font-size: 0.875rem; + padding: 0 0.54rem; + min-height: 35px; + background-color: var(--input-bg); + border: 2px solid var(--input-border); + color: var(--input-font); + text-align: center; +} +#rss .rss { + grid-auto-rows: max-content; + box-shadow: var(--shadows); + border-radius: 0.3rem; + background-color: var(--windows); + background-image: var(--noise); + color: var(--text); + font-size: 1rem; +} +@media (max-width: 1023px) { + #rss .rss { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #rss .rss { + padding: 1rem; + } +} +#rss .rss a { + color: var(--link); + text-decoration: none; + border-bottom: 1px solid; +} diff -r 000000000000 -r 78edf6b517a0 .cms/css/sitemap.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/css/sitemap.css Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,255 @@ +#sitemap { + display: grid; + height: 100%; + overflow-y: auto; + grid-auto-rows: max-content; + row-gap: 1rem; +} +#sitemap form { + display: grid; + gap: 1rem; +} + +@media (max-width: 1023px) { + #sitemap { + padding: 1rem 0.4rem 1rem 0.4rem; + display: flex; /*Samsung Browser - padding-bottom*/ + flex-direction: column; /*Samsung Browser - padding-bottom*/ + } + #sitemap form { + grid-template-columns: 1fr; + grid-template-areas: + "xml-wrapper-hidden" + "xml-wrapper-link" + "xml-static-dynamic" + "xml-static-cron"; + } +} +@media (min-width: 1024px) { + #sitemap { + padding: 1rem; + } + #sitemap form { + grid-template-columns: 1fr 1fr; + grid-template-areas: + "xml-wrapper-hidden xml-wrapper-link" + "xml-static-dynamic xml-static-cron"; + } +} + +#sitemap .xml-wrapper-hidden, #sitemap .xml-wrapper-link, #sitemap .xml-static-dynamic, #sitemap .xml-static-cron { + display: grid; + grid-auto-rows: max-content; + row-gap: 0.7rem; + box-shadow: var(--shadows); + border-radius: 0.3rem; + background-color: var(--windows); + background-image: var(--noise); +} +#sitemap .xml-static-cron { + grid-template-rows: auto auto 1fr auto; +} +#sitemap .xml-wrapper-hidden div, #sitemap .xml-wrapper-link div, #sitemap .xml-static-dynamic div, #sitemap .xml-static-cron div, #sitemap .sitemap-manual div { + color: var(--windows-font); +} + +@media (max-width: 1023px) { + #sitemap .xml-wrapper-hidden, #sitemap .xml-wrapper-link, #sitemap .xml-static-dynamic, #sitemap .xml-static-cron { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #sitemap .xml-wrapper-hidden, #sitemap .xml-wrapper-link, #sitemap .xml-static-dynamic, #sitemap .xml-static-cron { + padding: 1rem; + } +} + +#sitemap textarea { + line-height: 1.3em; + resize: vertical; + width: 100%; + background-color: var(--input-bg); + border: 2px solid var(--input-border); + border-radius: 4px; + font-family: var(--monospace); + font-size: 1rem; + color: var(--input-font); + padding: 0 8px; + min-height: 30px; +} + +/*#sitemap input[type="submit"] { + cursor: pointer; + width: max-content; +}*/ +#sitemap form div > input { + border-radius: 4px; + font-size: 0.875rem; + padding: 0 0.54rem; + min-height: 35px; + width: 100%; + color: var(--input-font); + background-color: var(--input-bg); + border: 2px solid var(--input-border); +} + +#sitemap form div > button { + width: fit-content; +} + +#sitemap .save_2_col { + display: grid; +} +#sitemap .save_2_col > button { + grid-area: button; +} +#sitemap .save_2_col > div { + grid-area: div; +} +@media (max-width: 767px) { + #sitemap .save_2_col { + grid-template-columns: 1fr; + row-gap: 0.7rem; + } + #sitemap .save_2_col { + grid-template-areas: + "div" + "button"; + } +} +@media (min-width: 768px) { + #sitemap .save_2_col { + grid-template-areas: + "button div"; + grid-template-columns: auto 1fr; + column-gap: 1rem; + } +} + + +#sitemap .select-dropdown { + position: relative; +} +#sitemap .select-dropdown ul.list-search { + height: 0; + background-color: var(--bg-3); + display: grid; + margin: 0; + margin-top: 2px; + padding: 0; + overflow-y: auto; + max-height: 17rem; + overscroll-behavior: contain; + position: absolute; + width: 100%; + border-radius: 4px; +} +#sitemap .select-dropdown.open ul.list-search { + height: auto; + border: 2px solid var(--bg-4); +} +#sitemap .select-dropdown .list-search li { + display: block; + list-style-type: none; + padding: 0.4rem 0.44rem; + cursor: pointer; + font-size: 0.94rem; + text-align: left; +} +#sitemap .select-dropdown .list-search li:hover { + background-color: var(--menu-item-list-search-li-hover-active); +} + +#sitemap .xml-static-dynamic input[type="text"] { + color: var(--input-font); +} +#sitemap .xml-static-dynamic label input[type="radio"] { + cursor: pointer; + display: inline-block; + margin-right: 0.3rem; + border-radius: 50%; + width: 0.73rem; + height: 0.73rem; + background-color: var(--bg-4); + transform: translate(0, 0); + appearance: none; +} +#sitemap .xml-static-dynamic label input:checked { + background-color: var(--orange); + border-color: var(--orange); + box-shadow: 0 0 0 0.25rem var(--focus-orange); +} + +#sitemap .xml-static-dynamic label { + cursor: pointer; + line-height: 1.1em; + font-size: 1rem; + color: var(--link); + user-select: none; +} + +#sitemap .xml-static-cron p { + font-size: 1rem; + color: var(--text); +} +#sitemap .xml-static-cron input[type="text"] { + max-width: 70px; + border-radius: 4px; + font-size: 0.875rem; + padding: 0 0.54rem; + min-height: 35px; + background-color: var(--input-bg); + border: 2px solid var(--input-border); + color: var(--input-font); + text-align: center; +} +#sitemap .sitemap { + grid-auto-rows: max-content; + box-shadow: var(--shadows); + border-radius: 0.3rem; + background-color: var(--windows); + background-image: var(--noise); + color: var(--text); + font-size: 1rem; +} +@media (max-width: 1023px) { + #sitemap .sitemap { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #sitemap .sitemap { + padding: 1rem; + } +} +#sitemap .sitemap a { + color: var(--link); + text-decoration: none; + border-bottom: 1px solid; +} + +#sitemap .sitemap-manual { + display: grid; + grid-auto-rows: max-content; + gap: 1rem; + box-shadow: 0 2px 3px 0 rgb(0 0 0 / 20%); + border-radius: 0.3rem; + background-color: var(--windows); + background-image: var(--noise); +} + +#sitemap .sitemap-manual p { + font-size: 1rem; + color: var(--text); +} + +@media (max-width: 1023px) { + #sitemap .sitemap-manual { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #sitemap .sitemap-manual { + padding: 1rem; + } +} \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/css/template.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/css/template.css Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,468 @@ +#template { + display: grid; + height: 100%; +} + +#template > .settings { + display: grid; + gap: 1rem; + overflow-y: auto; + grid-column: 1/-1; + grid-row: 1/-1; +} + +@media (max-width: 1023px) { +#template > .settings { + grid-template-areas: + "template-install" + "template-switch" + "template-files" + "template-manual" + "template-headers" + "milk"; + grid-template-rows: auto auto auto auto 1fr; + padding: 1rem 0.4rem 1rem 0.4rem; + display: grid; + } +} + +@media (min-width: 1024px) { + #template > .settings { + grid-template-areas: + "template-install template-headers template-manual" + "template-switch template-headers template-manual" + "template-files template-files template-files" + "milk milk milk"; + grid-template-columns: 17rem 1fr 1fr; + grid-template-rows: auto auto auto 1fr; + padding: 1rem; + } +} + +#template .template { + grid-area: template-switch; + display: grid; + align-content: start; + row-gap: 1rem; + box-shadow: var(--shadows); + background-color: var(--windows); + background-image: var(--noise); + border-radius: 0.3rem; +} + +#template .template label { + display: grid; + grid-template-columns: auto 1fr; + column-gap: 0.5rem; + cursor: pointer; + line-height: 1.3; + color: var(--windows-font); + user-select: none; +} + +#template .template form { + display: grid; + row-gap: 1rem; +} + +@media (max-width: 1023px) { + #template .template { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #template .template { + padding: 1rem; + } +} + +#template form > div { + position: relative; + color: var(--windows-font); +} + +#template .template-install { + grid-area: template-install; + padding: 10px; + border-radius: 0.3rem; + background-color: var(--windows); +} +#template .upload_dnd { + display: grid; + position: relative; + text-align: center; + padding: 0.4rem 0.7rem 0.5rem 0.7rem; + white-space: nowrap; + cursor: pointer; + border-radius: 0.3rem; + background-color: var(--button-bg); + color: var(--windows-font); + font-size: 1rem; + justify-content: center; + display: block; +} +#template .upload_dnd #template-upload { + width: 100%; + height: 100%; + left: 0; + right: 0; + top: 0; + bottom: 0; + opacity: 0; + overflow: hidden; + position: absolute; + z-index: 7; + cursor: pointer; +} + + +#template .template-headers { + grid-area: template-headers; + display: grid; + grid-template-rows: auto 1fr auto; + padding: 1rem; + row-gap: 0.7rem; + box-shadow: var(--shadows); + border-radius: 0.3rem; + background-color: var(--windows); + background-image: var(--noise); +} +#template .template-headers textarea { + line-height: 1.3em; + resize: none; + background-color: var(--input-bg); + border: 2px solid var(--input-border); + border-radius: 4px; + font-family: var(--monospace); + font-size: 1rem; + color: var(--input-font); + padding: 0 8px; + min-height: 30px; +} + +#template .template-manual { + grid-area: template-manual; + display: grid; + grid-auto-rows: max-content; + gap: 1rem; + border-radius: 0.3rem; + box-shadow: var(--shadows); + background-color: var(--windows); + background-image: var(--noise); +} +#template .template-manual div { + color: var(--windows-font); +} +#template .template-manual p { + font-size: 1rem; + color: var(--text); +} +#template .template-manual p a { + color: var(--link); +} + +@media (max-width: 1023px) { + #template .template-manual { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #template .template-manual { + padding: 1rem; + } +} + +#template .template-files { + grid-area: template-files; + display: grid; + align-content: start; + row-gap: 1rem; + background-color: var(--windows); + background-image: var(--noise); + box-shadow: var(--shadows); + border-radius: 0.3rem; +} +@media (max-width: 1023px) { + #template .template-files { + padding: 1rem 0.7rem 1rem 0.7rem; + } +} +@media (min-width: 1024px) { + #template .template-files { + padding: 1rem; + } +} + +.template-files .title { + color: var(--windows-font); + padding-bottom: 0.2rem; +} +.template-files .file { + font-size: 1rem; + font-family: var(--monospace); + color: var(--template-files-file); + width: fit-content; + display: flex; /* Mobile Browser - fit-content inline */ + cursor: pointer; +} +.template-files .file:hover { + color: var(--template-files-file-hover); +} +.template-files .no-files { + font-size: 1rem; + color: var(--text); +} + + + +/* Проверить */ + +#template .template-editor-bg { + display: grid; + position: relative; + grid-row: 1/-1; + grid-column: 1/-1; + z-index: 9; + background-color: var(--bg-3); + background-image: var(--noise); +} +@media (min-width: 1024px) { + #template .template-editor-bg { + padding: 1rem; + } +} +#template .template-editor-bg.hidden { + display: none; +} + +#template .template-editor-grid { + background-color: var(--bg-3); + display: grid; + position: relative; + box-shadow: 0 0 3px 0 #00000096; + grid-template-rows: auto 1fr 1rem; + grid-template-columns: 1fr auto; + grid-template-areas: + "template-editor-header template-editor-header" + "template-editor snip" + "bottom bottom"; +} +#template .template-editor-grid::before { + content: ""; + position: absolute; + left: 3px; + top: 3px; + z-index: 1; + width: 7px; + height: 7px; + border-radius: 50%; +} +#template .template-editor-grid[data-changed="true"]::before { + background-color: var(--changes); +} +@media (min-width: 1024px) { + #template .template-editor-grid { + border-radius: 5px; + } +} + +.template-editor-header { + grid-area: template-editor-header; + display: grid; +} +@media (max-width: 1023px) { + .template-editor-header { + grid-template-areas: + "close save title"; + grid-template-columns: max-content max-content 1fr; + grid-column-gap: 1rem; + grid-row-gap: 0.5rem; + padding: 10px; + } +} +@media (min-width: 1024px) { + .template-editor-header { + padding: 10px; + grid-template-columns: max-content max-content 1fr; + gap: 1rem; + } +} + +#template .snip-grid { + grid-area: snip; + display: grid; + gap: 15px; + align-content: start; + width: max-content; + overflow-y: auto; + background-color: var(--tags-bg); + position: relative; + scrollbar-width: none; +} +@media (max-width: 500px) { + #template .snip-grid { + display: none; + } +} + +#template .snip-grid > .html > div, #template .snip-grid > .css > div, #template .snip-grid > .php > div { + display: flex; + gap: 7px; + padding: 7px 15px 7px 15px; + color: var(--tags-font); + font-size: 0.9rem; + cursor: pointer; + justify-content: space-between; +} +#template .snip-grid a { + padding: 7px 15px 7px 15px; + color: var(--link); + font-size: 0.9rem; + text-underline-offset: 0.22rem; + text-decoration-color: var(--link); +} + +#template .html, #template .css, #template .php { + display: grid; +} +#template .html.hidden, #template .css.hidden, #template .php.hidden { + display: none; +} + +.close-template-button { + position: relative; + cursor: pointer; + width: 2rem; + height: 2rem; + border-radius: 3px; + background-color: var(--bg-3); + background-repeat: no-repeat; + background-position: center center; + background-size: 40%; + background-image: var(--icon-close); +} +.close-template-button:hover { + background-color: var(--bg-4); +} +@media (max-width: 1023px) { + .close-template-button { + grid-area: close; + } +} + +.save-template-button { + cursor: pointer; + width: 2rem; + height: 2rem; + position: relative; + background-color: var(--bg-3); + background-repeat: no-repeat; + background-position: center center; + background-size: 55%; + background-image: var(--icon-save); + border-radius: 3px; +} +.save-template-button:hover { + background-color: var(--bg-4); +} +.save-template-button.saved { + background-color: var(--saved-bg); +} +@media (max-width: 1023px) { + .save-template-button { + grid-area: save; + justify-self: right; + } +} + +@media (max-width: 1023px) { + .template-editor-title { + grid-area: title; + } +} + +.template-editor-title { + font-family: var(--monospace); + color: var(--template-files-file); + width: fit-content; + align-self: center; +} + +.template-editor { + grid-area: template-editor; +} +.template-editor .CodeMirror { + min-height: 100%; + max-height: 100%; + height: 1rem; + font-family: var(--monospace); + font-weight: normal; + font-size: 1.04rem; +} +.CodeMirror-dialog input { + font-family: var(--monospace); + font-size: 100%; +} + +#template .CodeMirror-wrap pre.CodeMirror-line, #template .CodeMirror-wrap pre.CodeMirror-line-like { + word-wrap: break-word; + white-space: pre-wrap; + word-break: break-all; +} + +/* Select */ +#template .template-select-grid { + text-align: left; +} +#template .field-select { + display: grid; + grid-template-columns: 1fr 32px; + height: 100%; + min-height: 30px; + cursor: pointer; + background-color: var(--menu-input-bg); + border: 2px solid var(--menu-input-border); + border-radius: 4px; + user-select: none; +} +#template .field-select > .value { + padding: 0 0 0 0.44rem; + white-space: nowrap; + overflow: hidden; + line-height: 32px; + font-size: 1rem; + color: var(--text); +} +#template .field-select > .icon { + background-image: var(--select-icon); + background-repeat: no-repeat; + background-position: center; + background-size: 12px; +} +#template .template-select-grid .field-options { + display: grid; + position: absolute; + height: 0; + overflow: hidden; + width: 100%; + border-radius: 0.25rem; + box-shadow: 0 2px 3px 0 #00000033; + max-height: 17rem; + z-index: 7; +} +#template .template-select-grid .field-options.open { + background-color: var(--bg-3); + border: 2px solid var(--bg-4); + color: var(--text); + overflow: auto; + height: auto; + margin-top: 2px; +} +#template .template-select-grid .field-options .option { + padding: 0.4rem 0.44rem; + cursor: pointer; + font-size: 0.94rem; +} +#template .template-select-grid .field-options .option:hover { + background-color: var(--bg-2); +} diff -r 000000000000 -r 78edf6b517a0 .cms/img/favicon.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/favicon.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.default.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.default.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.doc.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.doc.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.docx.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.docx.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.exe.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.exe.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.flac.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.flac.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.m4a.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.m4a.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.mkv.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.mkv.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.mp3.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.mp3.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.mp4.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.mp4.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.ogg.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.ogg.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.pdf.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.pdf.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.rar.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.rar.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.webm.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.webm.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.xls.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.xls.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.xlsx.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.xlsx.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/icon.zip.svg --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/img/icon.zip.svg Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1 @@ + \ No newline at end of file diff -r 000000000000 -r 78edf6b517a0 .cms/img/noise-dark.png Binary file .cms/img/noise-dark.png has changed diff -r 000000000000 -r 78edf6b517a0 .cms/img/noise-light.png Binary file .cms/img/noise-light.png has changed diff -r 000000000000 -r 78edf6b517a0 .cms/js/admin.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/js/admin.js Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,678 @@ +// Две функции для чтения и установки cookie. +// Cookie используются для авторизации на сайте, +// для запоминания количества отображаемых страниц в пейджере +// и выбранной темы. +// Другие модули так же могут их использовать +// для запоминания своих настроек. +function get_cookie( name ) { + let cookies = document.cookie.split( ";" ); + for ( let line of cookies ) { + let cookie = line.split( "=" ); + // TODO: Нужно ли decodeURIComponent( cookie[ 0 ].trim() )? + // Имена указываются обычно латиницей, без специальных знаков... + if ( name == cookie[ 0 ].trim() ) { + return decodeURIComponent( cookie[ 1 ] ); + } + } + return ""; +} + +// ;Path=/ в админке нет смысла указывать, но можно экономить байты куков +// браузер сам по умолчанию возьмет текущий путь +function set_cookie( name, value ) { + document.cookie = encodeURIComponent( name ) + "=" + encodeURIComponent( value ) + ";SameSite=Lax"; +} + +function set_cookie_expires( name, value ) { + let expires = ( new Date( Date.now() + 365 * 86400 * 1000 ) ).toUTCString(); + document.cookie = encodeURIComponent( name ) + "=" + encodeURIComponent( value ) + ";SameSite=Lax;expires=" + expires; +} + +// Чтобы удалить куки нужно установить отрицательную дату истечения срока действия +function del_cookie( name ) { + document.cookie = encodeURIComponent( name ) + "=;SameSite=Lax;max-age=-1"; +} + +// Notifications + +// Уведомления, отображающиеся в правом верхнем. Обычно в течении 5 сек. +// Через 5 секунд к уведомлению добавляется класс timeout, +// благодаря ему происходит исчезновение уведомления. +function notify( message, classes, msec ) { + let bulb = document.createElement( "div" ); + bulb.innerHTML = message; + bulb.className = classes; + document.querySelector( ".log-info-box" ).appendChild( bulb ); + let h = bulb.offsetHeight; + // Чтобы анимировать схлопывание + bulb.setAttribute( "style", `height:${h}px` ); + if ( msec ) { + setTimeout( function() { + bulb.classList.add( "timeout" ); + }, msec); + } +} + +// Translate +// module: "admin.mod.php" or "pages.mod.php" etc + +// Шаблон admin добавляет глобальную js-переменную +// в которой содержится текущая локаль и переводы, +// загруженные из файлов .cms/lang/... +// Поэтому ими можно пользоваться и на стороне админки. +function __( str, module ) { + if ( cms && cms.locale && cms.lang && cms.lang[module] && cms.lang[module][cms.locale] && cms.lang[module][cms.locale][str] ) { + return cms.lang[module][cms.locale][str]; + } else { + api( { fn: "no_translation", str: str, module: module } ); + return str; + } +} + +// Call server side API + +// Передаваемые на сервер данные упаковываются как положено +// и можно передавать даже массивы. +// Массивы вложенные в массивы воспринимаются как объекты +// и кодируются в JSON. +// После того, как сервер вернет ответ, вызывается функция rfn +// И ответ передается ей в качестве параметра. +function api( data, rfn, efn ) { + const formData = new FormData(); + buildFormData( formData, data ); + // send data + // По умолчанию запросы отправляются асинхронно, + // но если нужно дождаться ответа и затем изменить полученные данные, + // то перед вызовом обновляющих функций нужно дописать строчку + // cms.async_api = false; + let ajax = new XMLHttpRequest(); + ajax.addEventListener( "load", function( event ) { + let data = {}; + try { + data = JSON.parse( event.target.responseText ); + } catch { + notify( __( "server_error", "admin.mod.php" ), "info-error", 5000 ); + if ( efn ) { + efn( event ); + } + } + if ( rfn ) { + rfn( data ); + } + } ); + ajax.addEventListener( "error", function( event ) { + notify( __( "network_error", "admin.mod.php" ), "info-error", 5000 ); + if ( efn ) { + efn( event ); + } + } ); + ajax.open( "POST", cms.api, cms.async_api ); + ajax.send( formData ); + cms.async_api = true; +} +function buildFormData( formData, data, parentKey ) { + if ( data && typeof data === 'object' && ! ( data instanceof Date ) && ! ( data instanceof File ) ) { + Object.keys( data ).forEach( key => { + buildFormData( formData, data[key], parentKey ? `${parentKey}[${key}]` : key ); + } ); + } else { + const value = data == null ? '' : data; + formData.append( parentKey, value ); + } +} + + +// Create and connect Codemirror +function codemirror_connect( selector, name, options = {} ) { + + if ( window[name] ) return; + + let default_options = { + mode: "application/x-httpd-php", + styleActiveLine: true, + lineNumbers: true, + lineWrapping: true, + autoCloseBrackets: true, + smartIndent: true, + indentUnit: 4, + tabSize: 4, + matchBrackets: true, + foldGutter: true, + gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"], + autoCloseTags: { + whenClosing: true, + whenOpening: true, + indentTags: [ "div", "ul", "ol", "script", "style" ], + }, + phrases: { + "Search:": __( "codemirror_search", "admin.mod.php" ), + "(Use /re/ syntax for regexp search)" : __( "codemirror_re", "admin.mod.php" ), + "Replace all:": __( "codemirror_replace_all", "admin.mod.php" ), + "With:": __( "codemirror_replace_with", "admin.mod.php" ), + "Replace:": __( "codemirror_replace_replace", "admin.mod.php" ), + "Replace?": __( "codemirror_replace_confirm", "admin.mod.php" ), + "Yes": __( "codemirror_yes", "admin.mod.php" ), + "No": __( "codemirror_no", "admin.mod.php" ), + "All": __( "codemirror_all", "admin.mod.php" ), + "Stop": __( "codemirror_stop", "admin.mod.php" ), + }, + extraKeys: { "Ctrl-Space": "autocomplete" } + } + + let txtarea = document.querySelector( selector ); + options = Object.assign( default_options, options ); + window[name] = CodeMirror.fromTextArea( txtarea, options ); + + if ( window[name].showHint ) { + window[name].on( "keydown", function( editor, event ) { + if ( event.ctrlKey == true ) { return } // Ctrl+S call Hint + let isAlphaKey = /^[a-zA-Z]$/.test( event.key ); + if ( window[name].state.completionActive && isAlphaKey ) { + return; + } + + // Prevent autocompletion in string literals or comments + let cursor = window[name].getCursor(); + let token = window[name].getTokenAt( cursor ); + if ( token.type === "string" || token.type === "comment" ) { + return; + } + + let lineBeforeCursor = window[name].doc.getLine( cursor.line ); + if ( typeof lineBeforeCursor !== "string" ) { + return; + } + lineBeforeCursor = lineBeforeCursor.substring( 0, cursor.ch ); + + // disable autoclose tag before text + let charAfterCursor = window[name].doc.getLine( cursor.line ); + charAfterCursor = charAfterCursor.substring( cursor.ch, cursor.ch + 1 ); + window[name].options.autoCloseTags.dontCloseTags = null; + if ( charAfterCursor.match( /\S/ ) && charAfterCursor != "<" ) { + if ( lineBeforeCursor.match( /<[^>]+$/ ) ) { + let tag = lineBeforeCursor.match( /<(\w+)\b[^>]*$/ ); + if ( tag ) { + tag = tag[1]; + window[name].options.autoCloseTags.dontCloseTags = [tag]; + } + } + } + + let m = CodeMirror.innerMode( window[name].getMode(), token.state ); + let innerMode = m.mode.name; + let shouldAutocomplete; + if ( innerMode === "html" || innerMode === "xml" ) { + shouldAutocomplete = event.key === "<" || + event.key === "/" && token.type === "tag" || + isAlphaKey && token.type === "tag" || + isAlphaKey && token.type === "attribute" || + token.string === "=" && token.state.htmlState && token.state.htmlState.tagName; + } else if ( innerMode === "css" ) { + shouldAutocomplete = isAlphaKey || + event.key === ":" || + event.key === " " && /:\s+$/.test( lineBeforeCursor ); + } else if ( innerMode === "javascript" ) { + shouldAutocomplete = isAlphaKey || event.key === "."; + } else if ( innerMode === "clike" && window[name].options.mode === "php" ) { + shouldAutocomplete = token.type === "keyword" || token.type === "variable"; + } + if ( shouldAutocomplete ) { + window[name].showHint( { completeSingle: false } ); + } + } ); + } + + // Replace < with < in code context + // https://stackoverflow.com/a/36388061/20443861 + window[name].on( "inputRead", function( cm, event ) { + if ( event.origin == "paste" ) { + if ( cm.paste_context == "code" ) { + let text = event.text.join( "\n" ); // pasted string + let new_text = text.replaceAll( / div` ).length; + if ( childs ) { + notify( _( "not_empty_section" ), "info-error", 2000 ); + return; + } + if ( ! confirm( _( "confirm_delete" ) ) ) return; + let data = { + fn: "admin_menu_del", + item: item, + } + api( data, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + if ( r.info_time ) { + setTimeout( function() { + window.location.reload( true ); + }, r.info_time ); + } + } + } ); + } ); + } ); + + // Admin section, Hide + document.querySelectorAll( "[data-am-sw]" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + let el = this.closest( "[data-am-item]" ); + let data = { + fn: "admin_menu_hide", + type: el.getAttribute( "data-am-type" ), + module: el.getAttribute( "data-am-module" ), + item: el.getAttribute( "data-am-item" ), + hide: el.classList.contains( "showed" ), + } + if ( data.item == "admin_menu" ) { + if ( ! confirm( _( "hide_admin_settings" ) ) ) return false; + } + api( data, function( r ) { + if ( r.ok == "true" ) { + window.location.reload( true ); + } + } ); + } ); + } ); + + // Admin section, Add Section + document.querySelectorAll( "#admin_menu .main-footer .add-section" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + api( { fn: "admin_menu_add_section" }, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + if ( r.info_time ) + setTimeout( function() { + window.location.reload( true ); + }, r.info_time ); + } + } ); + } ); + } ); + + + // Reset all items in Admin Menu + document.querySelectorAll( "#admin_menu .main-footer .reset-all" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + api( { fn: "reset_admin_menu_items" }, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + if ( r.info_time ) + setTimeout( function() { + window.location.reload( true ); + }, r.info_time ); + } + } ); + } ); + } ); + + + // Disable Modules + document.querySelectorAll( "#modules .module-sw-btn" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + let closest = this.closest( "[data-module]" ); + let data = { + fn: "module_disable", + disable: closest.classList.contains( "enabled" ), + module: closest.getAttribute( "data-module" ), + } + api( data, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + } else { + window.location.reload( true ); + } + } ); + } ); + } ); + + // Delete Module + document.querySelectorAll( "#modules .module-del-btn" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + let module = this.closest( "[data-module]" ).getAttribute( "data-module" ); + let data = { + fn: "module_del", + module: module, + } + api( data, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + } + } ); + } ); + } ); + + // Close Sessions + document.querySelectorAll( "#auth [data-login]" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + e.preventDefault(); + if ( ! confirm( _( "confirm_logout" ) ) ) return; + let parent = button.parentElement; + var data = { + fn: "logout", + sess: this.getAttribute( "data-login" ), + } + api( data, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + if ( r.result == "refresh" ) { + // refresh приходит если мы закрываем свою сессию + window.location.reload( true ); + } else if ( r.result == "ok" ) { + // Перемещаем сессию в закрытые путем копирования html, + // предварительно удалив класс del-sess чтобы не отображался крестик. + // А старый элемент удаляем. + // При копировании html так же удаляется привязанная функция. + button.classList.remove( "del-sess" ); + let html = parent.outerHTML; + parent.remove(); + document.querySelector( ".history-sess .sess-table" ).insertAdjacentHTML( "afterbegin", html ); + } + } + } ); + } ); + } ); + + // Show/Hide password + document.querySelectorAll( ".password-eye" ).forEach( function( eye ) { + eye.addEventListener( "click", function( e ) { + this.classList.toggle( "showed" ); + let inp = this.previousElementSibling; + let t = inp.getAttribute( "type" ); + if ( t == "password" ) { + inp.setAttribute( "type", "text" ); + } else { + inp.setAttribute( "type", "password" ); + } + inp.focus(); + } ); + } ); + + // Install module (upload module) + let input = document.querySelector( "#module-upload" ); + if ( input ) input.addEventListener( "change", async function( e ) { + const formData = new FormData(); + formData.append( "fn", "install_module" ); + for ( let i = 0; i < input.files.length; i++ ) { + formData.append( "myfile[]", input.files[i] ); + } + let ajax = new XMLHttpRequest(); + /* + ajax.upload.addEventListener( "progress", function( event ) { + let percent = Math.round( (event.loaded / event.total) * 100 ); + bar.style.width = percent + "%"; + }, false ); + + ajax.addEventListener( "error", function( event ) { + notify( _( "error_upload_file" ), "info-error", 3600000 ); + bar.style = ""; + }, false ); + + ajax.addEventListener( "abort", function( event ) { + notify( _( "error_upload_file" ), "info-error", 3600000 ); + bar.style = ""; + }, false ); + */ + let google_chrome_fix = this; + ajax.addEventListener( "load", function( event ) { + google_chrome_fix.value = ""; + let r = JSON.parse( event.target.responseText ); + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + if ( r.info_class === "info-success" ) setTimeout( function() { + window.location.reload( true ); + }, r.info_time ); + } + } ); + ajax.open( "POST", cms.api ); + ajax.send( formData ); + } ); + + // БД. Открытие дополнительных настроек. + document.querySelectorAll( "#base .pro-btn" ).forEach( function( pro ) { + pro.addEventListener( "click", function( e ) { + document.querySelector( "#base form" ).classList.toggle( "show-pro" ); + } ); + } ); + + // Выбор секции Админского меню. Select + document.querySelectorAll( "#admin_menu .field-select" ).forEach( function( select ) { + select.addEventListener( "click", function( e ) { + e.stopPropagation(); + this.parentElement.classList.toggle( "open" ); + + // это можно убрать если переставить стили на родителя + select.nextElementSibling.classList.toggle( "open" ); + } ); + } ); + + // Выбор секции Админского меню. Option + document.querySelectorAll( "#admin_menu .field-options .option" ).forEach( function( select ) { + select.addEventListener( "click", function( e ) { + let input = this.closest( ".section-select-grid" ).querySelector( ".field-select" ); + input.querySelector( ".value" ).innerText = this.innerText; + input.setAttribute( "data-section", this.getAttribute( "value" ) ); + } ); + } ); + // Select + // Закрытие выпадающих списков при кликах вне их, а так же по ним + document.body.addEventListener( "click", function( e ) { + document.querySelectorAll( "#admin_menu .section-select-grid" ).forEach( function( list ) { + list.classList.remove( "open" ); + } ); + + // это можно убрать если переставить стили на родителя + document.querySelectorAll( "#admin_menu .field-options" ).forEach( function( list ) { + list.classList.remove( "open" ); + } ); + } ); + + + /* Обновление и проверка файлов */ + + document.querySelectorAll( "#modules [data-fn]" ).forEach( function( button ) { + button.addEventListener( "click", function() { + let fn = this.getAttribute( "data-fn" ); + let data = { + fn: fn + } + api( data, function( r ) { + if ( r.answer ) { + switch ( fn ) { + case "cms_update": + document.querySelector( "#modules .update-window" ).insertAdjacentHTML( "beforeend", r.answer ); + break; + case "create_zip": + document.querySelector( "#modules .dev-window" ).insertAdjacentHTML( "beforeend", r.answer ); + break; + case "cms_check_update": + case "cms_check_dev_update": + document.querySelector( "#modules .check-answer" ).innerHTML = r.answer; + break; + case "cms_changed_files": + let div = document.querySelector( "#modules .changed-files" ); + div.innerHTML = r.answer; + div.style.display = ""; + break; + } + } + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + } + if ( r.reload ) { + setTimeout( function() { + window.location.reload( true ); + }, r.info_time ); + } + } ); + } ); + } ); + + // show update from dev buttons + document.querySelectorAll( "#modules [data-show-dev]" ).forEach( function( btn ) { + btn.addEventListener( "click", function() { + let dev = document.querySelector( "#modules .developers_only" ); + if ( dev ) { + dev.classList.remove( "developers_only" ); + if ( window.location.host == "dev.coffee-cms.ru" ) { + dev.querySelector( "#modules [data-fn='create_zip']" ).removeAttribute( "style" ); + } + } + this.remove(); + } ); + } ); + +} ); diff -r 000000000000 -r 78edf6b517a0 .cms/js/menu.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/js/menu.js Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,426 @@ +document.addEventListener( "DOMContentLoaded", function( event ) { + + function _( str ) { + return __( str, "menu.mod.php" ); + } + + function select3( selects ) { + selects.forEach( function( select ) { + // именно keyup чтобы не пересекалось с input + select.querySelector( "input" ).addEventListener( "keyup", function( e ) { + api( { fn: "get_search_pages_list", search: this.value }, function( r ) { + if ( r.html ) { + select.querySelector( ".list-search" ).innerHTML = r.html; + select.querySelectorAll( ".list-search li" ).forEach( function( li ) { + li.addEventListener( "click", select3_li ); + } ); + } + } ); + } ); + // prevent close dropdown when click on input + select.querySelector( "input" ).addEventListener( "click", function( e ) { + e.stopPropagation(); + } ); + // show/hide dropdown list + select.querySelector( ".field-select" ).addEventListener( "click", function ( event ) { + event.stopPropagation(); + this.parentElement.classList.toggle( "open" ); + let list = event.currentTarget.nextElementSibling; + + // это можно убрать если переставить стили на родителя + list.classList.toggle( "open" ); + + if ( list.classList.contains( "open" ) ) { + let input = select.querySelector( "input" ); + input.focus(); + input.dispatchEvent( new Event( "keyup" ) ); + } + } ); + } ); + } + + // click selected item + function select3_li( e ) { + let id = this.getAttribute( "data-id" ); + let url = this.getAttribute( "data-url" ); + let title = this.innerText; + let input_title = this.closest( ".select-grid" ).querySelector( ".field-select" ); + let old_id = input_title.getAttribute( "data-old-id" ); + input_title.querySelector( ".value" ).innerText = title; + input_title.setAttribute( "data-id", id ); + // поменять url в поле ввода + let input_url = this.closest( ".menu-prop" ).querySelector( "input[name='url']" ); + input_url.value = url; + // поменять заголовок и ссылку вверху + let a = this.closest( ".item" ).querySelector( ":scope > a" ); + a.setAttribute( "href", cms.base_path + url ); + let replaced_title = this.closest( ".menu-prop" ).querySelector( `input[name="title"]` ).value; + if ( replaced_title ) title = replaced_title; + a.innerText = title; + if ( id === "0" ) { + input_url.removeAttribute( "disabled" ); + } else { + input_url.setAttribute( "disabled", true ); + } + // remove li except data-id=0 + Array.from( this.parentElement.children ).forEach( function( li ) { + if ( li.getAttribute( "data-id" ) !== "0" ) { + li.remove(); + } + } ); + // close dropdown list + input_title.click(); + // изменение + if ( old_id != id ) { + input_title.dispatchEvent( new Event( "input" ) ); + } + } + + api( { fn: "get_menu_items" }, set_menu_items ); + + function set_menu_items( r ) { + + document.querySelector( "#menu .menu-grid" ).innerHTML = r.list; + + // set parents for each menu item + document.querySelectorAll( "#menu [data-parent]" ).forEach( function( el ) { + el.nextElementSibling.insertAdjacentHTML( "beforeend", r.parents ); + let pid = el.getAttribute( "data-parent" ); + let parent = el.nextElementSibling.querySelector( `[value="${pid}"]` ).innerText.trim(); + el.querySelector( ".value" ).innerText = parent; + // remove self + let self = el.closest( "[data-item]" ).getAttribute( "data-item" ); + self = el.nextElementSibling.querySelector( `[value="${self}"]` ); + if ( self ) { + self.remove(); + } + } ); + + // selects + let selects = document.querySelectorAll( "#menu .select-grid" ); + select3( selects ); + + // Select + document.querySelectorAll( "#menu .area-select-grid .field-select-menu, #menu .parent-select-grid .field-select" ).forEach( function( select ) { + select.addEventListener( "click", function( e ) { + e.stopPropagation(); + this.parentElement.classList.toggle( "open" ); + + // это можно убрать если переставить стили на родителя + select.nextElementSibling.classList.toggle( "open" ); + } ); + } ); + // Option for menu + document.querySelectorAll( "#menu .area-select-grid .field-options .option" ).forEach( function( option ) { + option.addEventListener( "click", function( e ) { + let input = this.closest( ".area-select-grid" ).querySelector( ".field-select-menu" ); + let old_val = input.getAttribute( "data-menu-area" ); + let new_val = this.getAttribute( "value" ); + if ( old_val != new_val ) { + input.querySelector( ".value" ).innerText = this.innerText; + input.setAttribute( "data-menu-area", new_val ); + // Событие изменения + let event = new Event( "input" ); + input.dispatchEvent( event ); + } + //e.stopPropagation(); убираем чтобы закрылось автоматически + } ); + } ); + // Option for item + document.querySelectorAll( "#menu .parent-select-grid .field-options .option" ).forEach( function( option ) { + option.addEventListener( "click", parent_li_click ); + } ); + function parent_li_click( e ) { + let input = this.closest( ".parent-select-grid" ).querySelector( ".field-select" ); + let old_val = input.getAttribute( "data-parent" ); + let new_val = this.getAttribute( "value" ); + if ( old_val != new_val ) { + input.querySelector( ".value" ).innerText = this.innerText.trim(); + input.setAttribute( "data-parent", new_val ); + // Событие изменения + let event = new Event( "input" ); + input.dispatchEvent( event ); + } + //e.stopPropagation(); убираем чтобы закрылось автоматически + } + + // Toggle Menu Properties + let prop_buttons = document.querySelectorAll( "#menu .menu-buttons .prop" ); + prop_buttons.forEach( function( button ) { + button.addEventListener( "click", function( e ) { + e.stopPropagation(); + this.closest( "[data-item]" ).classList.toggle( "open" ); + } ); + } ); + + // Отлавливать изменения полей в меню чтобы показать Сохранить + document.querySelectorAll( "#menu .menu" ).forEach( function( menu ) { + menu.querySelectorAll( "input, .field-select-menu" ).forEach( function( input ) { + input.addEventListener( "input", function( event ) { + let menu = this.closest( ".menu" ); + menu.classList.add( "changed" ); + } ); + } ); + } ); + + // Отлавливать изменения полей в пунктах чтобы показать Сохранить + document.querySelectorAll( "#menu .item" ).forEach( function( item ) { + item.querySelectorAll( "input, .field-select" ).forEach( function( input ) { + input.addEventListener( "input", function( event ) { + let item = this.closest( ".item" ); + item.classList.add( "changed" ); + } ); + } ); + } ); + + // Save Properties + document.querySelectorAll( "#menu .menu-buttons .save" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + e.stopPropagation(); + + let item = this.closest( "[data-item]" ); + let mid = item.getAttribute( "data-item" ); + + let area = item.querySelector( "[data-menu-area]" ); + if ( area ) { + area = area.getAttribute( "data-menu-area" ); + } + + let tag_title = item.querySelector( "[name='tag_title']" ); + if ( tag_title ) { + tag_title = tag_title.value; + } + + let url = item.querySelector( "[name='url']" ); + if ( url ) { + url = url.value; + } + + let id = item.querySelector( "[name='id']" ); + if ( id ) { + id = id.getAttribute( "data-id" ); + } + + let pid_el = item.querySelector( "[data-parent]" ); + let pid,old_pid; + if ( pid_el ) { + pid = pid_el.getAttribute( "data-parent" ); + old_pid = pid_el.getAttribute( "data-old-parent" ); + } + + let target = item.querySelector( "[name='targetblank']" ); + if ( target ) { + target = target.checked; + } + + let old_sort_el = item.querySelector( "[name='sort']" ); + let old_sort = old_sort_el.getAttribute( "data-sort" ); + + let data = { + fn: "save_menu_item", + mid: mid, + title: item.querySelector( "[name='title']" ).value, + tag_title: tag_title, + url: url, + id: id, + pid: pid, + old_pid: old_pid, + classes: item.querySelector( "[name='classes']" ).value, + sort: item.querySelector( "[name='sort']" ).value, + area: area, + target: target + } + document.querySelectorAll( `#menu [data-item]` ).forEach( function( el ) { + el.classList.remove( "last-edited" ); + } ); + api( data, function( r ) { + if ( r.ok == "false" ) { + notify( r.info_text, r.info_class, r.info_time ); + } + if ( r.ok == "true" ) { + item.classList.remove( "changed" ); + let item_with_childs = item.parentElement; + if ( r.list ) { + set_menu_items( r ); + } else if ( old_sort != data.sort ) { + // пересортировка имеет смысл если не было замены всего списка + // обновить сортировку для сравнения + old_sort_el.setAttribute( "data-sort", data.sort ); + let grid; + if ( data.area === null ) { + grid = item.closest( ".items-grid" ); + } else { + grid = item.closest( ".menu-grid" ); + } + let before = null; + for ( let n = 0; n < grid.children.length; n++ ) { + let node = grid.children[n]; + if ( node != item_with_childs ) { + let sort = node.querySelector( '[data-item] [name="sort"]' ).value; + if ( +data.sort < +sort ) { + before = node; + break; + } + } + }; + grid.insertBefore( item_with_childs, before ); + } + + // Замена title + let title; + if ( data.title != "" ) + title = data.title; + else + title = item.querySelector( ".select-grid .value" ).innerText; + item.querySelector( ":scope > a" ).innerText = title; + + // обновить родителей у подпунктов + // поскольку мог измениться title + // и только у строго дочерних, которых может и не быть + let childs_grid = item.nextElementSibling; + if ( childs_grid ) { + let childs_selector = childs_grid.querySelectorAll( ":scope > div > .item .parent-select-grid" ); + + if ( childs_selector ) childs_selector.forEach( function( grid ) { + let input = grid.querySelector( "[data-parent]" ); + let pid = input.getAttribute( "data-parent" ); + let options = grid.querySelector( ":scope > .field-options" ); + options.innerHTML = r.parents; + options.querySelectorAll( ".option" ).forEach( function( option ) { + option.addEventListener( "click", parent_li_click ); + } ); + // тайтл вычисляется выше + input.querySelector( ".value" ).innerText = title; + } ); + } + + // Last Edited Marker + setTimeout( function() { + document.querySelector( `#menu [data-item="${data.mid}"]` ).classList.add( "last-edited" ); + }, 200 ); + } + } ); + } ); + } ); + + // Delete Menu or Item + document.querySelectorAll( "#menu .menu-buttons .del" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + e.stopPropagation(); + clear_highlite(); + let item = button.closest( ".item,.menu" ).parentNode; + item.classList.add( "will-be-deleted" ); + setTimeout( function() { + if ( ! confirm( __( "confirm_delete", "menu.mod.php" ) ) ) { + item.classList.remove( "will-be-deleted" ); + return; + } + let data = { + fn: "del_menu_item", + mid: button.closest( "[data-item]" ).getAttribute( "data-item" ) + }; + api( data, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + if ( r.info_class == "info-success" ) { + set_menu_items( r ); + } + } + } ); + }, 20 ); + } ); + } ); + + // Create Item + document.querySelectorAll( "#menu .main-main .append" ).forEach( function( button ) { + button.addEventListener( "click", modMenuCreate ); + } ); + + // Линия к родителю + let items = document.querySelectorAll( "#menu .item" ); + items.forEach( function( el ) { + el.addEventListener( "click", function( e ) { + // Если опускание мыши было не на нас, то игнорим + if ( mouse_down_el != this ) return; + mouse_down_el = null; + let highlited = this.classList.contains( "highlite-children" ); + clear_highlite(); + // Назначить классы + if ( ! highlited ) { + this.classList.add( "highlite-children" ); + this.closest( ".items-grid" ).classList.add( "highlite-parent" );; + } + } ); + } ); + // Опускание мыши + // Возможна ситуация когда нажатие мыши было на кнопке Свойства, + // а отпускание на плашке. В этом случае может появиться линия к родителю. + // Поэтому нужно записывать что опускание было на плашке или панельке кнопок. + let mouse_down_el; // элемент на котором было опускание мыши + items.forEach( function( el ) { + el.addEventListener( "mousedown", function( e ) { + // чтобы проигнорировать клики по дочерним + if ( e.target == this ) + mouse_down_el = this; + } ); + // див с кнопками можно тыкать + let mb = el.querySelector( ".menu-buttons" ); + if ( mb ) mb.addEventListener( "mousedown", function( e ) { + // чтобы проигнорировать клики по дочерним + if ( e.target == this ) + mouse_down_el = this.parentElement; + } ); + } ); + // Сбросить классы + function clear_highlite() { + document.querySelectorAll( "#menu .items-grid.highlite-parent" ).forEach( function( el ) { + el.classList.remove( "highlite-parent" ); + } ); + document.querySelectorAll( "#menu .item.highlite-children" ).forEach( function( el ) { + el.classList.remove( "highlite-children" ); + } ); + } + + } + + // Select + // Закрытие выпадающих списков при кликах вне их, а так же по ним + document.body.addEventListener( "click", function( e ) { + // это можно убрать если переставить стили на родителя + document.querySelectorAll( "#menu .field-options" ).forEach( function( list ) { + list.classList.remove( "open" ); + } ); + + document.querySelectorAll( "#menu .area-select-grid, #menu .select-grid, #menu .parent-select-grid" ).forEach( function( list ) { + list.classList.remove( "open" ); + } ); + } ); + + // Создание меню или пункта меню + function modMenuCreate( e ) { + e.stopPropagation(); + let pid = this.closest( "[data-item]" ).getAttribute( "data-item" ); + api( { fn : "create_menu_item", pid : pid }, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + if ( r.info_class == "info-success" ) { + set_menu_items( r ); + let item = document.querySelector( `#menu [data-item="${r.mid}"]` ); + item.classList.add( "open" ); + item.classList.add( "last-edited" ); + // Докрутить к новому элементу + item.scrollIntoView( { behavior: "smooth", block: "center" } ); + } + } + } ); + } + + // Create Menu + document.querySelector( "#menu .main-footer .create" ).addEventListener( "click", modMenuCreate ); + + // update page used in menu + document.body.addEventListener( "update_menu", function( e ) { + api( { fn: "get_menu_items" }, set_menu_items ); + } ); + +} ); diff -r 000000000000 -r 78edf6b517a0 .cms/js/pages.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/js/pages.js Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,1265 @@ +document.addEventListener( "DOMContentLoaded", function( event ) { + + function _( str ) { + return __( str, "pages.mod.php" ); + } + + // Полностью этот скрипт отключить нельзя если включены Инструменты, + // поэтому нужна проверка + if ( document.querySelector( "#pages" ) ) { + api( { fn: "get_pages_list" }, set_pages_list ); + } + + function set_pages_list( r ) { + + if ( ! document.querySelector( "#pages" ) ) return; + + if ( r.no_database ) { + document.querySelector( "#pages .pages-grid" ).innerHTML = r.no_database; + return; + } + + if ( r.overloaded ) { + let m = _( "server_overloaded_xxx" ); + m = m.replace( "xxx", r.pages.length ); + notify( m, "info-error", 5000 ); + } + + // Запоминаем результаты какого поиска мы получили + // Это нужно чтобы не загружать снова все страницы при создании новой + // не производить сброс поиска. + let pages_search = document.querySelector( "#pages .page-search" ); + pages_search.setAttribute( "data-result-of", r.search ); + + let grid = document.querySelector( "#pages .pages-grid" ); + let count = document.querySelector( "#pages .main-footer .count" ); + let loaded = document.querySelector( "#pages .main-footer .loaded" ); + if ( cms.clear_pages_list ) { + cms.clear_pages_list = false; + grid.innerHTML = ""; + loaded.value = "0"; + } + + // Всего страниц в БД + count.innerText = r.count; + + // При удалении страниц подгружаются последние и не нужно менять смещение у пейджера + if ( cms.dont_change_offset ) { + cms.dont_change_offset = false; + } else { + loaded.setAttribute( "data-offset", r.offset ); + } + + // insert pages + let start = Date.now(); + for ( let i = 0; i < r.pages.length; i++ ) { + grid.insertAdjacentHTML( "beforeend", r.pages[i].html ); + loaded.value = +loaded.value + 1; + let page = grid.querySelector( `[data-id="${r.pages[i].id}"]` ); + set_controls( page ); + if ( Date.now() - start > 1000 ) { + let m = _( "browser_overloaded_xxx" ); + m = m.replace( "xxx", i + 1 ); + m = m.replace( "nnn", r.pages.length ); + notify( m, "info-error", 5000 ); + break; + } + } + + create_pager(); + + // При создании страницы было обнаружено что поиск не сброшен, + // поэтому была вызвана функция загрузки страниц с пустым поиском + // и пришло время создать новую страницу + if ( cms.create_page_fn ) { + cms.create_page_fn(); + cms.create_page_fn = null; + } + + } + + function create_pager() { + let loaded = document.querySelector( "#pages .main-footer .loaded" ); + let offset = parseInt( loaded.getAttribute( "data-offset" ) ); + let count = parseInt( document.querySelector( "#pages .main-footer .count" ).innerText ); + if ( count === 0 ) { count++; } + let cookie_pp = get_cookie( "pages_pager" ); + let pages = Math.ceil( count / cookie_pp ); + let pager = document.querySelector( "#pages .main-footer .pager" ); + pager.innerHTML = ""; + if ( pages > 1 ) { + for ( let i = 1; i <= pages; i++ ) { + let p = document.createElement( "div" ); + p.innerText = i; + p.setAttribute( "data-offset", ( i - 1 ) * cookie_pp ); + pager.appendChild( p ); + } + pager.querySelector( `[data-offset="${offset}"]` ).classList.add( "active" ); + pager.childNodes.forEach( function( el ) { + el.addEventListener( "click", function( e ) { + let offset = this.getAttribute( "data-offset" ); + let search = document.querySelector( "#pages .page-search" ).value; + let data = { + fn: "get_pages_list", + offset: offset, + search: search + } + document.querySelector( "#pages .main-main" ).scrollTop = 0; + cms.clear_pages_list = true; + api( data, set_pages_list ); + } ); + } ); + // scroll + pager.onmousedown = function( e ) { + let pageX = 0; + let pageY0 = 0; + + document.onmousemove = function( e ) { + if ( pageX !== 0 ) { + pager.scrollLeft = pager.scrollLeft + ( pageX - e.pageX ); + } + pageX = e.pageX; + // fix for google chrome + if ( pageY0 === 0 ) { + pageY0 = e.pageY; + } + if ( Math.abs( pageY0 - e.pageY ) > 64 ) { + const event = new Event( "mouseup" ); + pager.dispatchEvent( event ); + } + } + + // end drag + pager.onmouseup = function() { + document.onmousemove = null; + pager.onmouseup = null; + } + + // disable browser drag + pager.ondragstart = function() { + return false; + } + } + } + } + + // pager counter + let pager_counter = document.querySelector( "#pages .main-footer input" ); + if ( pager_counter ) pager_counter.addEventListener( "keydown", function( e ) { + if ( e.keyCode === 13 ) { // keyCode work on mobile + let p = document.querySelector( "#pages .main-footer input" ).value; + set_cookie_expires( "pages_pager", p ); + cms.clear_pages_list = true; + api( { fn: "get_pages_list", search: document.querySelector( "#pages .page-search" ).value }, set_pages_list ); + } + } ); + + function set_controls( selector ) { + + // Open properties + selector.querySelectorAll( ".page-prop-btn" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + let id = this.closest( "[data-id]" ).getAttribute( "data-id" ); + document.querySelector( `#pages .pages-grid [data-id="${id}"]` ).classList.toggle( "open" ); + } ); + } ); + + // Save properties + selector.querySelectorAll( ".page-prop-save-btn" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + let id = this.closest( "[data-id]" ).getAttribute( "data-id" ); + let item = document.querySelector( `#pages .pages-grid [data-id="${id}"] ` ); + let data = { + fn: "save_prop", + id: id, + title: item.querySelector( '[name="title"]' ).value, + seo_title: item.querySelector( '[name="seo_title"]' ).value, + url: item.querySelector( '[name="url"]' ).value, + date: item.querySelector( '[name="date"]' ).value, + time: item.querySelector( '[name="time"]' ).value, + template: item.querySelector( '.template-select-grid .field-select' ).getAttribute( "data-template" ), + old_template: item.querySelector( '.template-select-grid .field-select' ).getAttribute( "data-old-template" ), + description: item.querySelector( '[name="description"]' ).value, + tags: item.querySelector( '[name="tags"]' ).value, + } + api( data, function( r ) { + if ( r.ok == "false" ) { // FIXME: never fire + notify( r.info_text, r.info_class, 5000 ); + } + if ( r.ok == "true" ) { + + // Update Title, URL and Date + item.querySelector( ".page-name" ).innerHTML = r.title; + item.querySelector( ".page-name" ).setAttribute( "href", r.base_path + r.url ); + update_home(); + let url_el = item.querySelector( "[name=url]" ); + if ( url_el.value != r.url ) { + notify( _( "url_changed" ), "info-error", 5000 ); + } + url_el.value = r.url; + let date = item.querySelector( ".page-date" ); + date.innerHTML = r.created; + if ( r.planned ) { + date.classList.add( "future" ); + } else { + date.classList.remove( "future" ); + } + + // update old template + item.querySelector( '.template-select-grid .field-select' ).setAttribute( "data-old-template", data.template ); + + // edit marker + document.querySelectorAll( "#pages .pages-grid > div" ).forEach( function( el ) { + el.classList.remove( "last-edited" ); + } ); + setTimeout( function() { + item.classList.add( "last-edited" ); + }, 200 ); + + // highlight save button + button.classList.add( "saved" ); + setTimeout( function() { + button.classList.remove( "saved" ); + }, 200 ); + + notify( r.info_text, r.info_class, 5000 ); + + // update event for menu + if ( r.update_menu == "true" ) { + let event = new Event( "update_menu" ); + document.body.dispatchEvent( event ); + } + } + + } ); + } ); + } ); + + // Pin Page + selector.querySelectorAll( ".pin" ).forEach( function( pin ) { + pin.addEventListener( "click", function( e ) { + let box = this.closest( "[data-id]" ); + let id = box.getAttribute( "data-id" ); + let pin = box.getAttribute( "data-pin" ); + if ( pin === "1" ) { + pin = "0"; + } else { + pin = "1"; + } + let data = { + fn: "page_pin", + id: id, + pin: pin + } + api( data, function( r ) { + if ( r.ok == "true" ) { + box.setAttribute( "data-pin", pin ); + } + } ); + } ); + } ); + + // Publish Page + selector.querySelectorAll( ".published" ).forEach( function( pub ) { + pub.addEventListener( "click", function( e ) { + let box = this.closest( "[data-id]" ); + let id = box.getAttribute( "data-id" ); + let published = box.getAttribute( "data-published" ); + if ( published === "1" ) { + published = "0"; + } else { + published = "1"; + } + let data = { + fn: "page_publish", + id: id, + published: published + } + api( data, function( r ) { + if ( r.ok == "true" ) { + box.setAttribute( "data-published", published ); + if ( published == "1" ) { + pub.setAttribute( "title", _( "published" ) ); + } else { + pub.setAttribute( "title", _( "unpublished" ) ); + } + } + } ); + } ); + } ); + + // Edit page + selector.querySelectorAll( ".page-edit-btn" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + button.classList.add( "loading" ); + let id = this.closest( "[data-id]" ).getAttribute( "data-id" ); + // get page from server + api( { fn: "get_page", id: id }, function( r ) { + button.classList.remove( "loading" ); + if ( r.result == "ok" ) { + let title = document.querySelector( "#pages .page-editor-title" ); + title.innerHTML = r.page.title; + title.setAttribute( "href", r.base_path + r.page.url ); + let props = document.querySelector( "#pages .page-properties" ); + props.querySelector( "input[name='title']" ).value = r.page.title; + props.querySelector( "input[name='url']" ).value = r.page.url; + props.querySelector( "input[name='seo_title']" ).value = r.page.seo_title; + props.querySelector( "textarea[name='description']" ).value = r.page.description; + props.querySelector( "textarea[name='tags']" ).value = r.page.tags; + props.querySelector( "input[name='date']" ).value = r.date; + props.querySelector( "input[name='time']" ).value = r.time; + let select = props.querySelector( ".template-select-grid" ); + let options = select.querySelector( ".field-options" ); + options.innerHTML = r.options; + let tpl = select.querySelector( ".field-select" ); + tpl.setAttribute( "data-template", r.option ); + tpl.setAttribute( "data-old-template", r.option ); + tpl.querySelector( ".value" ).innerText = r.option_tr; + document.querySelector( "#pages .page-editor > textarea" ).value = r.page.text; + if ( r.page.modified != null ) { // prevent delete attribute + document.querySelector( "#pages .page-editor > textarea" ).setAttribute( "data-modified", r.page.modified ); + } + document.querySelector( "#pages .save-page-button" ).setAttribute( "data-id", r.page.id ); + + options.querySelectorAll( ".option" ).forEach( function( option ) { + option.addEventListener( "click", click_select_option ); + } ); + + + // Images + document.querySelector( "#pages .link-file-tag" ).innerHTML = ""; + document.querySelector( "#pages .del-uploaded-files" ).classList.add( "disabled" ); + document.querySelector( "#pages .mediateka-files-grid" ).innerHTML = r.flist; + document.querySelectorAll( "#pages .mediateka-files-grid input[type=checkbox]" ).forEach( function( checkbox ) { + checkbox.addEventListener( "dblclick", img_check_dblclick ); + checkbox.addEventListener( "change", img_rechecked ); + } ); + document.querySelectorAll( "#pages .file-block" ).forEach( function( block ) { + block.addEventListener( "click", img_click ); + } ); + document.querySelectorAll( "#pages .mediateka-files-grid img" ).forEach( function( img ) { + img.addEventListener( "dblclick", img_lbox ); + } ); + + // Show Editor + document.querySelector( "#pages .page-editor-bg" ).classList.remove( "hidden" ); + document.body.classList.add( "editor" ); // for notifications + + // Connect Editor + codemirror_connect( "#pages .page-editor > textarea", "cm" ); + + // restore scroll and cursor position + let cursor = localStorage.getItem( "cursor_page_" + id ); + if ( cursor ) { + cursor = JSON.parse( cursor ); + window.cm.scrollTo( cursor.left, cursor.top ); + window.cm.setCursor( { line:cursor.line, ch:cursor.ch } ); + window.cm.refresh(); + //window.cm.scrollIntoView( { line:cursor.line, ch:cursor.ch } ); // fix glitch + } + + // track changes + document.querySelector( "#pages .close-page-button" ).setAttribute( "data-changed", "false" ); + document.querySelector( "#pages .page-editor-grid" ).setAttribute( "data-changed", "false" ); + cm.on( "change", function( cm, change ) { + document.querySelector( "#pages .close-page-button" ).setAttribute( "data-changed", "true" ); + document.querySelector( "#pages .page-editor-grid" ).setAttribute( "data-changed", "true" ); + } ); + // save scroll and cursor position + [ "cursorActivity", "scroll" ].forEach( function( event ) { + cm.on( event, function() { + let cursor = window.cm.getCursor(); + let scroll = window.cm.getScrollInfo(); + localStorage.setItem( "cursor_page_" + id, JSON.stringify( { line:cursor.line, ch:cursor.ch, left: scroll.left, top: scroll.top } ) ); + } ); + } ); + + // set focus to editor + cm.focus(); + + // Save Page Ctrl+S + document.documentElement.addEventListener( "keydown", CtrlS ); + + // open tags panel + if ( document.documentElement.offsetWidth >= 1024 ) { + document.querySelector( "#pages .page-editor-grid" ).classList.add( "tags-opened" ); + } + } + } ); + } ); + } ); + + // Select + selector.querySelectorAll( ".field-select" ).forEach( function( select ) { + select.addEventListener( "click", function( e ) { + e.stopPropagation(); + this.parentElement.classList.toggle( "open" ); + + // это можно убрать если переставить стили на родителя + select.nextElementSibling.classList.toggle( "open" ); + } ); + } ); + // Option шаблона + // вынесено в функцию потому что динамическое изменение + selector.querySelectorAll( ".field-options .option" ).forEach( function( option ) { + option.addEventListener( "click", click_select_option ); + } ); + + // Транслитерация URL + selector.querySelectorAll( ".url-translit" ).forEach( function( btn ) { + btn.addEventListener( "click", function( e ) { + let url = selector.querySelector( "input[name='title']" ).value; + let tr_url = url_translit( url ); + this.previousElementSibling.value = tr_url; + } ); + } ); + + // Выбор всех страниц двойным кликом + let check = selector.querySelector( `:scope > input[type=checkbox]` ); + if ( check ) check.addEventListener( "dblclick", function( e ) { + let stat = ! this.checked; + document.querySelectorAll( "#pages .pages-grid > div > input[type=checkbox]" ).forEach( function( chbox ) { + chbox.checked = stat; + } ); + } ); + + } + + // Клик по опции выбора шаблона + function click_select_option( e ) { + let select = this.closest( ".template-select-grid" ); + let value = this.getAttribute( "value" ); + select_switch_to( select, value ); + } + + // + function select_switch_to( select, value ) { + let field_select = select.querySelector( ".field-select" ); + let old_value = field_select.getAttribute( "data-template" ); + if ( old_value != value ) { + let old_name = field_select.innerText; + let field_options = select.querySelector( ".field-options" ); + let option = field_options.querySelector( `[value="${value}"]` ); + field_select.querySelector( ".value" ).innerText = option.innerText; + field_select.setAttribute( "data-template", value ); + option.remove(); + let option_html = `
${old_name}
`; + field_options.insertAdjacentHTML( "afterbegin", option_html ); + field_options.firstChild.addEventListener( "click", click_select_option ); + } + } + + // Select for editor + document.querySelectorAll( ".page-properties .field-select" ).forEach( function( select ) { + select.addEventListener( "click", function( e ) { + e.stopPropagation(); + this.parentElement.classList.toggle( "open" ); + // это можно убрать если переставить стили на родителя + select.nextElementSibling.classList.toggle( "open" ); + } ); + } ); + + // Select + // Закрытие выпадающих списков при кликах вне их, а так же по ним + document.body.addEventListener( "click", function( e ) { + document.querySelectorAll( "#pages .template-select-grid" ).forEach( function( list ) { + list.classList.remove( "open" ); + } ); + + // это можно убрать если переставить стили на родителя + document.querySelectorAll( "#pages .field-options" ).forEach( function( list ) { + list.classList.remove( "open" ); + } ); + } ); + + // Search page + let pages_search = document.querySelector( "#pages .page-search" ); + if ( pages_search ) pages_search.addEventListener( "keydown", function( e ) { + if ( e.keyCode === 13 ) { + // сохраняем событие целиком чтобы ниже считать Shift, Ctrl, Alt + cms.search_event = e; + search_pages(); + } + } ); + + let search_btn = document.querySelector( "#pages .page-search-button" ); + if ( search_btn ) search_btn.addEventListener( "click", function( e ) { + // клик по кнопке не дает Ctrl, Shift, Alt, запишем это + cms.search_event = { "ctrlKey": false, "shiftKey": false, "altKey": false }; + search_pages(); + document.querySelector( "#pages .page-search" ).focus(); + } ); + + function search_pages() { + let search_string = document.querySelector( "#pages .page-search" ).value; + let data = { + fn: "get_pages_list", + search: search_string, + Ctrl: cms.search_event.ctrlKey, + Shift: cms.search_event.shiftKey, + Alt: cms.search_event.altKey, + }; + cms.clear_pages_list = true; + api( data, set_pages_list ); + } + + // Reset Search + let reset_btn = document.querySelector( "#pages .reset" ); + if ( reset_btn ) reset_btn.addEventListener( "click", function() { + document.querySelector( "#pages .page-search" ).value = ""; + document.querySelector( "#pages .page-search-button" ).click(); + } ); + + // Delete pages + document.querySelectorAll( "#pages .del-pages-btn" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + let ids = []; + document.querySelectorAll( "#pages .pages-grid input[type=checkbox]:checked" ).forEach( function( ch ) { + let id = ch.closest( "[data-id]" ).getAttribute( "data-id" ); + ids.push( id ); + } ); + if ( ids.length === 0 ) { + notify( _( "no_selected_pages" ), "info-error", 5000 ); + return; + } + if ( ! confirm( _( "confirm_delete_pages" ) ) ) { + return; + } + let data = { + fn: "del_pages", + ids: ids + }; + api( data, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, 5000 ); + if ( r.info_class == "info-success" ) { + data.ids.forEach( function( id ) { + document.querySelector( `#pages .pages-grid [data-id="${id}"]` ).remove(); + localStorage.removeItem( "cursor_page_" + id ); + } ); + let count = document.querySelector( "#pages .main-footer .count" ); + let loaded = document.querySelector( "#pages .main-footer .loaded" ); + loaded.value = parseInt( loaded.value ) - data.ids.length; + count.innerText = parseInt( count.innerText ) - data.ids.length; + // load pages + let offset = +loaded.getAttribute( "data-offset" ) + document.querySelectorAll( "#pages .pages-grid > *" ).length; + let search = document.querySelector( "#pages .page-search" ).value; + let data2 = { + fn: "get_pages_list", + count: data.ids.length, + offset: offset, + search: search + }; + // Не менять атрибут смещения у пейджера + cms.dont_change_offset = true; + api( data2, set_pages_list ); + } + } + // update event for menu + if ( r.update_menu == "true" ) { + let event = new Event( "update_menu" ); + document.body.dispatchEvent( event ); + } + } ); + } ); + } ); + + // copy file link button + document.querySelector( "#pages .link-file-copy-btn" ).addEventListener( "click", function( e ) { + let img = this.previousElementSibling.innerText; + let tmp = document.createElement( "textarea" ); + document.body.appendChild( tmp ); + tmp.value = img; + tmp.select(); + let r = document.execCommand( "copy" ); + tmp.remove(); + if ( r ) { + if ( img ) { + notify( _( "copyed" ), "info-success", 5000 ); + } else { + notify( _( "select_file" ), "info-error", 5000 ); + } + } else { + notify( _( "copy_error" ), "info-error", 5000 ); + } + cm.focus(); + } ); + + function CtrlS( e ) { + // ы and і - fix for librewolf + if ( ( e.code == "KeyS" || e.key == "ы" || e.key == "і" ) && e.ctrlKey == true ) { + e.preventDefault(); // don't save page + if ( window.location.hash == "#pages" ) { + document.querySelector( "#pages .save-page-button" ).click(); + } + } + /*/ Ловим кнопки codemirror + if ( e.code == "F1" ) { + let dialog = document.querySelector( ".CodeMirror-dialog-top" ); + let html = dialog.outerHTML; + cms.dialog = html; + //notify( html, "info-success", 5000000 ); + } + if ( e.code == "F2" ) { + document.querySelector( ".CodeMirror" ).insertAdjacentHTML( "beforeend", cms.dialog ); + } + */ + } + + // Save Page + document.querySelectorAll( "#pages .save-page-button" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + window.cm.save(); // drop changes to textarea + let main_div = document.querySelector( "#pages" ); + let prop_div = main_div.querySelector( ".page-properties" ); + let data = { + fn: "save_page", + id: main_div.querySelector( ".save-page-button" ).getAttribute( "data-id" ), + modified: main_div.querySelector( ".page-editor > textarea" ).getAttribute( "data-modified" ), + text: main_div.querySelector( ".page-editor > textarea" ).value, + title: prop_div.querySelector( "input[name='title']" ).value, + url: prop_div.querySelector( "input[name='url']" ).value, + seo_title: prop_div.querySelector( "input[name='seo_title']" ).value, + description: prop_div.querySelector( "textarea[name='description']" ).value, + tags: prop_div.querySelector( "textarea[name='tags']" ).value, + date: prop_div.querySelector( "input[name='date']" ).value, + time: prop_div.querySelector( "input[name='time']" ).value, + template: prop_div.querySelector( ".template-select-grid .field-select" ).getAttribute( "data-template" ), + old_template: prop_div.querySelector( ".template-select-grid .field-select" ).getAttribute( "data-old-template" ), + } + api( data, function( r ) { + if ( r.ok == "true" ) { + // set text + if ( r.new_text ) { + window.cm.setValue( r.new_text ); + } + + // Update Title and URL + main_div.querySelector( ".page-editor-title" ).innerHTML = r.title; + main_div.querySelector( ".page-editor-title" ).setAttribute( "href", r.base_path + r.url ); + prop_div.querySelector( "input[name='url']" ).value = r.url; + + // update old template + prop_div.querySelector( ".template-select-grid .field-select" ).setAttribute( "data-old-template", data.template ); + + // Update item in page list + let item = main_div.querySelector( `.pages-grid [data-id='${data.id}']` ); + item.querySelector( `.page-name` ).innerHTML = r.title; + item.querySelector( `.page-name` ).setAttribute( "href", r.base_path + r.url ); + update_home(); + item.querySelector( `input[name='title']` ).value = r.title; + item.querySelector( `input[name='url']` ).value = r.url; + item.querySelector( `input[name='seo_title']` ).value = data.seo_title; + item.querySelector( `textarea[name='description']` ).value = data.description; + item.querySelector( `textarea[name='tags']` ).value = data.tags; + + // Выставить шаблон в плашке в списке страниц + let select = item.querySelector( `.template-select-grid` ); + select_switch_to( select, data.template ); + item.querySelector( `.template-select-grid .field-select` ).setAttribute( "data-old-template", data.template ); + + item.querySelector( `input[name='date']` ).value = data.date; + item.querySelector( `input[name='time']` ).value = data.time; + if ( r.planned ) { + item.querySelector( `.page-date` ).classList.add( "future" ); + } else { + item.querySelector( `.page-date` ).classList.remove( "future" ); + } + + main_div.querySelector( ".page-editor > textarea" ).setAttribute( "data-modified", r.modified ); + main_div.querySelector( ".close-page-button" ).setAttribute( "data-changed", "false" ); + main_div.querySelector( ".page-editor-grid" ).setAttribute( "data-changed", "false" ); + // edit marker + main_div.querySelectorAll( ".pages-grid > div" ).forEach( function( item ) { + item.classList.remove( "last-edited" ); + } ); + item.classList.add( "last-edited" ); + // close editor after save + if ( main_div.querySelector( ".save-page-button" ).getAttribute( "data-close" ) === "true" ) { + main_div.querySelector( ".save-page-button" ).setAttribute( "data-close", "false" ); + main_div.querySelector( ".close-page-button" ).click(); + } + // highlight save button + main_div.querySelector( ".save-page-button" ).classList.add( "saved" ); + setTimeout( function() { + main_div.querySelector( ".save-page-button" ).classList.remove( "saved" ); + }, 1000 ); + + notify( r.info_text, r.info_class, r.info_time ); + + // update event for menu + if ( r.update_menu == "true" ) { + let event = new Event( "update_menu" ); + document.body.dispatchEvent( event ); + } + } + if ( r.ok == "false" ) { + // highlight save button + main_div.querySelector( ".save-page-button" ).classList.add( "error" ); + setTimeout( function() { + main_div.querySelector( ".save-page-button" ).classList.remove( "error" ); + }, 1000 ); + + notify( r.info_text, r.info_class, r.info_time ); + } + } ); + } ); + } ); + + // transliterate file name + function __tr_file( str ) { + let ext = str.match( /\.[^\.]+$/, "" ); + str = str.replace( /\.[^\.]+$/, "" ); + let sp = cms.tr[" "]; + cms.tr[" "] = "_"; + for ( let i in cms.tr ) { + let re = new RegExp( i, "g" ); + str = str.replace( re, cms.tr[i] ); + } + if ( sp === undefined ) { + delete cms.tr[" "]; + } else { + cms.tr[" "] = sp; + } + str = str.replace( /[^-A-Za-z0-9_]+/g, "" ); + if ( ext[0] ) { + str = str + ext[0]; + } + str = str.toLowerCase(); + return str; + } + + // Upload files + let upload_btn = document.querySelector( "#pages .upload-files input[type=file]" ); + if ( upload_btn ) upload_btn.addEventListener( "change", async function( event ) { + const formData = new FormData(); + let id = document.querySelector( "#pages .save-page-button" ).getAttribute( "data-id" ); + formData.append( "id", id ); + formData.append( "fn", "upload_files" ); + let n = 0; + for ( let i = 0; i < this.files.length; i++ ) { + formData.append( "myfile[]", this.files[i] ); + let f = `${cms.base_path}uploads/${id}/` + __tr_file( this.files[i].name ); + let f_exists = document.querySelector( `#pages .file-block [data-src="${f}"]` ); + if ( f_exists ) { n++; } + } + let google_chrome_fix = this; + if ( n ) { + let c = confirm( _( "same_files" ) + ` - ${n} ` + _( "pc" ) + "\n" + _( "confirm_replace" ) ); + if ( ! c ) { + google_chrome_fix.value = ""; + return c; + } + } + let bar = document.querySelector( "#pages .upload-progress" ); + + + let ajax = new XMLHttpRequest(); + + ajax.upload.addEventListener( "progress", function( event ) { + let percent = Math.round( (event.loaded / event.total) * 100 ); + bar.style.width = percent + "%"; + }, false ); + + ajax.addEventListener( "error", function( event ) { + notify( _( "error_upload_file" ), "info-error", 3600000 ); + bar.style = ""; + }, false ); + + ajax.addEventListener( "abort", function( event ) { + notify( _( "error_upload_file" ), "info-error", 3600000 ); + bar.style = ""; + }, false ); + + ajax.addEventListener( "load", function( event ) { + bar.style = ""; + google_chrome_fix.value = ""; + if ( event.target.status == 413 ) { + notify( _( "too_large" ), "info-error", 5000 ); + } else { + let r = JSON.parse( event.target.responseText ); + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + if ( r.info_class == "info-success" ) { + + // удалить файлы которые были обновлены + let tmp = document.createElement( "div" ); + tmp.innerHTML = r.flist; + let imgs = tmp.querySelectorAll( "img" ); + imgs.forEach( function( img ) { + let file = img.getAttribute( "data-src" ); + let exists_file = document.querySelector( `#pages .file-block [data-src="${file}"]` ); + if ( exists_file ) { + exists_file.parentElement.remove(); + } + } ); + + let container = document.querySelector( "#pages .mediateka-files-grid" ); + container.innerHTML = r.flist + container.innerHTML; + + // images checkboxes + container.querySelectorAll( "input[type=checkbox]" ).forEach( function( checkbox ) { + checkbox.addEventListener( "dblclick", img_check_dblclick ); + checkbox.addEventListener( "change", img_rechecked ); + } ); + + // open lightbox + container.querySelectorAll( "img" ).forEach( function( img ) { + img.addEventListener( "dblclick", img_lbox ); + } ); + + // generate link + container.querySelectorAll( ".file-block" ).forEach( function( file_block ) { + file_block.addEventListener( "click", img_click ); + } ); + + // select last uploaded + container.querySelector( ".file-block" ).click(); + } + } + } + }, false ); + + ajax.open( "POST", cms.api ); + ajax.send( formData ); + + } ); + + // Close Editor + document.querySelectorAll( "#pages .close-page-button" ).forEach( function( button ) { + button.addEventListener( "click", function( e ) { + + // hide mediateka + if ( ! document.querySelector( "#pages .page-editor-panel" ).classList.contains( "hidden" ) ) { + document.querySelector( "#pages .open-mediateka" ).click(); + } + + // hide editor + document.querySelector( "#pages .page-editor-bg" ).classList.add( "hidden" ); + document.body.classList.remove( "editor" ); + + document.documentElement.removeEventListener( "keydown", CtrlS ); + + // detach + if ( window.cm !== undefined ) { + if ( this.getAttribute( "data-changed" ) === "true" ) { + if ( confirm( _( "confirm_save" ) ) ) { + document.querySelector( "#pages .save-page-button" ).setAttribute( "data-close", "true" ); + document.querySelector( "#pages .save-page-button" ).click(); + return; + } + } + window.cm.toTextArea(); + window.cm = null; + } + + } ); + } ); + + // Create Page + document.querySelectorAll( "#pages .add-page-btn" ).forEach( function( btn ) { + btn.addEventListener( "click", function ( e ) { + // Отложенный вызов на случай если нужно очистить поиск + cms.create_page_fn = function() { + api( { fn: "create_page" }, function( r ) { + if ( r.info_text ) { + notify( r.info_text, r.info_class, r.info_time ); + } + if ( r.pages ) { + let grid = document.querySelector( "#pages .pages-grid" ); + grid.insertAdjacentHTML( "afterbegin", r.pages[0].html ); + // Подкрутить список страниц в начало + document.querySelector( "#pages .main-main" ).scrollTop = 0; + + let page_box = grid.querySelector( `[data-id="${r.pages[0].id}"]` ); + + set_controls( page_box ); + + let counter = document.querySelector( "#pages .main-footer .count" ); + counter.innerText = +counter.innerText + 1; + + let showed_pages_el = document.querySelector( "#pages .main-footer .counters input" ); + if ( showed_pages_el.value === get_cookie( "pages_pager" ) ) { + document.querySelector( "#pages .pages-grid > div:last-child" ).remove(); + } else { + showed_pages_el.value = +showed_pages_el.value + 1; + } + } + } ); + } + // Если сейчас не результаты поиска отображены, + // и если мы видим первый пейджер + // то сразу выполнить создание страницы + let empty_search = document.querySelector( "#pages .page-search" ).getAttribute( "data-result-of" ) === ""; + let offset_zero = +document.querySelector( "#pages .main-footer .counters input" ).getAttribute( "data-offset" ) === 0; + if ( empty_search && offset_zero ) { + cms.create_page_fn(); + cms.create_page_fn = null; + } else { + document.querySelector( "#pages .reset" ).click(); + // Создание страницы произведет функция set_pages_list() + } + } ); + } ); + + // Open Properties + document.querySelector( "#pages .open-properties" ).addEventListener( "click", function( e ) { + document.querySelector( "#pages .page-editor-grid" ).classList.toggle( "properties" ); + document.querySelector( "#pages .page-properties" ).classList.toggle( "hidden" ); + if ( window.cm ) { + let cursor = window.cm.getCursor(); + window.cm.scrollIntoView( { line:cursor.line, ch:cursor.ch } ); + } + if ( document.querySelector( "#pages .page-editor-grid" ).classList.contains( "properties" ) ) { + document.querySelector( "#pages .page-editor-grid" ).classList.remove( "mediateka" ); + document.querySelector( "#pages .page-editor-panel" ).classList.add( "hidden" ); + } + } ); + + // Open Mediateka + document.querySelector( "#pages .open-mediateka" ).addEventListener( "click", function( e ) { + document.querySelector( "#pages .page-editor-grid" ).classList.toggle( "mediateka" ); + document.querySelector( "#pages .page-editor-panel" ).classList.toggle( "hidden" ); + if ( window.cm ) { + let cursor = window.cm.getCursor(); + window.cm.scrollIntoView( { line:cursor.line, ch:cursor.ch } ); + } + if ( document.querySelector( "#pages .page-editor-grid" ).classList.contains( "mediateka" ) ) { + document.querySelector( "#pages .page-editor-grid" ).classList.remove( "properties" ); + document.querySelector( "#pages .page-properties" ).classList.add( "hidden" ); + } + cm.focus(); + } ); + + // Replace Dialog Toggle + document.querySelector( "#pages .codemirror-replace" ).addEventListener( "click", function( e ) { + let dialog = document.querySelector( "#pages .CodeMirror-dialog" ); + if ( dialog ) { + dialog.remove(); + } else { + let mediateka = ! document.querySelector( "#pages .page-editor-panel" ).classList.contains( "hidden" ); + if ( mediateka && window.innerWidth < 1024 ) { + document.querySelector( "#pages .open-mediateka" ).click(); + } + window.cm.execCommand( "replace" ); + } + } ); + + // generate link to clicked file + function img_click() { + this.parentElement.querySelectorAll( ".file-block" ).forEach( function( block ) { + block.classList.remove( "active-file" ); + } ); + this.classList.add( "active-file" ); + let i = this.querySelector( "img" ); + let t = i.getAttribute( "data-type" ); + let link = i.getAttribute( "data-src" ); + let w = i.getAttribute( "width" ); + let h = i.getAttribute( "height" ); + let e = link.replace( /.*\./, "" ); + let img = [ "webp", "tiff", "jpeg", "jpg", "png", "svg", "gif", "bmp", "ico" ]; + let mus = [ "mp3", "ogg", "m4a", "flac" ]; + let vid = [ "mp4", "mkv", "webm" ]; + let a = `${link}`; + let tag = this.closest( ".mediateka-grid" ).querySelector( ".link-file-tag" ); + if ( img.indexOf( e ) >= 0 ) { + link = `<img alt="" src="${a}"`; + if ( w ) { + link += ` width="${w}"`; + } + if ( h ) { + link += ` height="${h}"`; + } + link += ` loading="lazy"`; + link += ">"; + tag.innerHTML = link; + } else if ( mus.indexOf( e ) >= 0 ) { + link = `<audio src="${a}" controls></audio>`; + tag.innerHTML = link; + } else if ( vid.indexOf( e ) >= 0 ) { + link = `<video src="${a}" poster="" controls preload="none"></video>`; + tag.innerHTML = link; + } else { + link = `<a href="${a}">TEXT</a>`; + tag.innerHTML = link; + } + let inner_link = tag.querySelector( "a" ); + inner_link.addEventListener( "click", file_link_click ); + cm.focus(); + } + + function file_link_click( e ) { + e.preventDefault(); + let tmp = document.createElement( "textarea" ); + document.body.appendChild( tmp ); + tmp.value = e.target.getAttribute( "href" ); + tmp.select(); + let r = document.execCommand( "copy" ); + tmp.remove(); + if ( r ) { + notify( _( "copyed" ), "info-success", 5000 ); + } else { + notify( _( "copy_error" ), "info-error", 5000 ); + } + cm.focus(); + } + + // enable or disable delete files button + function img_rechecked() { + let checked = document.querySelectorAll( "#pages .mediateka-files-grid input[type=checkbox]:checked" ); + if ( checked.length ) { + document.querySelector( "#pages .del-uploaded-files" ).classList.remove( "disabled" ); + } else { + document.querySelector( "#pages .del-uploaded-files" ).classList.add( "disabled" ); + } + } + + // Выбор всех картинок двойным кликом + function img_check_dblclick( e ) { + let stat = ! this.checked; + document.querySelectorAll( "#pages .mediateka-files-grid input[type=checkbox]" ).forEach( function( chbox ) { + chbox.checked = stat; + } ); + img_rechecked(); + } + + // view in lightbox + function img_lbox() { + let src = this.getAttribute( "data-src" ); + let e = src.replace( /.*\./, "" ); + let img = [ "webp", "tiff", "jpeg", "jpg", "png", "svg", "gif", "bmp", "ico" ]; + let mus = [ "mp3", "ogg", "m4a", "flac" ]; + let vid = [ "mp4", "mkv", "webm" ]; + let t; + if ( document.querySelector( "#lbox-window" ) == null ) { + if ( img.indexOf( e ) >= 0 ) { + t = document.createElement( "img" ); + } else if ( mus.indexOf( e ) >= 0 ) { + t = document.createElement( "audio" ); + t.setAttribute( "controls", true ); + } else if ( vid.indexOf( e ) >= 0 ) { + t = document.createElement( "video" ); + t.setAttribute( "controls", true ); + } + if ( t !== undefined ) { + t.src = src; + let d = document.createElement( "div" ); + d.id = "lbox-window"; + d.appendChild( t ); + document.body.appendChild( d ); + d.addEventListener( "click", function( e ) { + this.remove(); + } ); + } + } + } + + + // Delete files + document.querySelector( "#pages .del-uploaded-files" ).addEventListener( "click", function( e ) { + if ( ! this.classList.contains( "disabled" ) ) { + let flist = []; + document.querySelectorAll( "#pages .mediateka-files-grid input[type=checkbox]:checked" ).forEach( function( e ) { + let f = e.closest( ".file-block" ).querySelector( "img" ).getAttribute( "data-src" ); + flist.push( f ); + } ); + let data = { + fn: "del_files", + flist: flist + }; + api( data, function( r ) { + if ( r.info_text ) { + document.querySelector( "#pages .link-file-tag" ).innerHTML = ""; + notify( r.info_text, r.info_class, r.info_time ); + if ( r.info_class == "info-success" ) { + for ( let f in flist ) { + document.querySelector( `#pages .mediateka-files-grid img[data-src="${flist[f]}"]` ).parentElement.remove(); + } + document.querySelector( "#pages .del-uploaded-files" ).classList.add( "disabled" ); + } + } + } ); + } + } ); + + // prevent hide cursor when window resize + window.addEventListener( "resize", function() { + if ( window.cm ) { + let cursor = window.cm.getCursor(); + window.cm.scrollIntoView( { line:cursor.line, ch:cursor.ch } ); + } + } ); + + // show/hide tags + let tags_btn = document.querySelector( "#pages .tags-helper" ); + if ( tags_btn ) tags_btn.addEventListener( "click", function( e ) { + document.querySelector( "#pages .page-editor-grid" ).classList.toggle( "tags-opened" ); + cm.focus(); + cm.refresh(); + } ); + + // for tags + document.querySelectorAll( "#pages .tags-grid [data-type='wrap']" ) .forEach( function( btn ) { + btn.addEventListener( "click", function( e ) { + let otag = this.getAttribute( "data-otag" ); + let ctag = this.getAttribute( "data-ctag" ); + let len = this.getAttribute( "data-len" ); + let ch = this.getAttribute( "data-ch" ); + let line = this.getAttribute( "data-line" ); + + //wrap_selections( otag, ctag, len, line, ch ); + let cursor = cm.getCursor(); + let selections = cm.getSelections(); + let replacements = []; + for ( let i = 0; i < selections.length; i++ ) { + replacements[i] = otag + selections[i] + ctag; + } + cm.replaceSelections( replacements ); + // Прятять панельку на мобильнике + if ( window.innerWidth < 1024 ) { + //document.querySelector( "#pages .tags-helper" ).click(); + let grid = this.closest( ".editor-grid" ); + grid.classList.remove( "tags-opened" ); + } + if ( selections.length < 2 ) { + if ( line ) { + cursor.line += +line; + cursor.ch = +ch; + } else if ( len ) { + cursor.ch += +len; + } + cm.setCursor( cursor ); + } + cm.focus(); + cm.refresh(); + } ); + } ); + // for tag + document.querySelectorAll( "#pages .tags-grid [data-type='wrap-a']" ) .forEach( function( btn ) { + btn.addEventListener( "click", function( e ) { + let cursor = cm.getCursor(); + let selections = cm.getSelections(); + let replacements = []; + + for ( let i = 0; i < selections.length; i++ ) { + if ( selections[i].match( /https?:\/\// ) ) { + replacements[i] = `${selections[i]}`; + } else { + replacements[i] = `${selections[i]}`; + } + } + + cm.replaceSelections( replacements ); + + if ( selections.length == 1 && selections[0] === "" ) { + cursor.ch += 9; + cm.setCursor( cursor ); + } + + if ( window.innerWidth < 1024 ) { + //document.querySelector( "#pages .tags-helper" ).click(); + let grid = this.closest( ".editor-grid" ); + grid.classList.remove( "tags-opened" ); + } + + cm.focus(); + cm.refresh(); + } ); + } ); + // for tags