Initial commit

main_plugin/site_tree/site_tree.css

@@ -0,0 +1,189 @@
+/* основной div */
+#treeDiv {
+    display: inline-block;
+    position: fixed;
+    z-index: 100;
+    user-select: none;
+    background-color: rgba(255, 255, 255, 0.92);
+    border: 1px solid #000000;
+    width: 800px;
+    border-radius: 5px;
+    height: 600px;
+    font-size: 1em;
+    box-shadow: 0px 0px 5px #777;
+    max-width: calc(100% - 20px);
+}
+
+/* верхний див */
+#treeTop {
+    text-align: center;
+    border-bottom: 1px #40464d solid;
+    padding: 5px;
+    background-color: rgba(255, 255, 255, 0.6);
+}
+#treeTopTitle {
+    text-align: center;
+}
+#treeCloseFun {
+    float: right;
+    width: 20px;
+    height: 20px;
+    background-position: -159px -121px;
+    cursor: pointer;
+}
+
+/* основное древо сайта */
+
+#treeTableDiv {
+    top: 36px;
+    height: 480px;
+    position: relative;
+    margin: 0px 20px 0px 20px;
+    border: 1px #40464d solid;
+    overflow-y: overlay;
+    border-radius: 5px;
+    width: calc(100% - 40px);
+}
+
+li.has-children::marker {
+	content: "► ";
+}
+li.has-children.open::marker {
+	content: "▼ ";
+}
+li.no-children::marker {
+	content: "□ ";
+}
+
+/* окно страницы */
+
+.tree-details {
+    display: none;
+    background: white;
+    border: 1px solid black;
+    padding: 3px;
+    margin: 3px 0px 10px 0px;
+    z-index: 10;
+    position: relative;
+    width: max-content;
+}
+.tree-details div {
+    margin: 3px;
+}
+
+/* окно настроек */
+#treeSettings {
+    display: inline-block;
+    position: fixed;
+    z-index: 100;
+    user-select: none;
+    background-color: rgba(255, 255, 255, 0.92);
+    border: 1px solid #000000;
+    border-radius: 5px;
+    font-size: 1em;
+    box-shadow: 0px 0px 5px #777;
+    padding: 5px;
+    animation: fadeIn 0.5s ease-in forwards;
+}
+
+.treeSettingsButtons {
+    background-color: rgba(255, 255, 255, 1);
+    border-radius: 5px;
+    padding: 2px;
+    margin: 3px;
+    cursor: pointer;
+    display: block;
+}
+.treeSettingsButtons:hover {
+    color: #787878;
+}
+
+#treeSettingsSave {
+    border: 1px #40464d solid;
+    border-radius: 5px;
+    padding: 5px;
+    margin: 44px 20px 0px 10px;
+    cursor: pointer;
+    display: block;
+    width: 91px;
+    float: right;
+}
+#treeSettingsSave:hover {
+    color: #787878;
+}
+
+/* окно свойств */
+#treeProperties {
+    display: inline-block;
+    position: fixed;
+    z-index: 100;
+    user-select: none;
+    background-color: rgba(255, 255, 255, 0.97);
+    border: 1px solid #000000;
+    border-radius: 5px;
+    font-size: 1em;
+    box-shadow: 0px 0px 5px #777;
+    width: 600px;
+    max-width: calc(100% - 20px);
+}
+#treePropertiesMiddle {
+    margin: 0px 20px 0px 20px;
+}
+
+#treePropertiesTop {
+    border-bottom: 1px solid #000000;
+    padding: 5px;
+    text-align: center;
+}
+#treePropertiesTopName {
+    text-align: center;
+}
+#treePropertiesTopClose {
+    float: right;
+    width: 20px;
+    height: 20px;
+    background-position: -159px -121px;
+    cursor: pointer;
+}
+
+#treePropertiesWindow {
+    text-align: center;
+    display: flex;
+}
+.treePropertiesWindowDiv {
+    cursor: pointer;
+    text-align: center;
+    width: 50%;
+    display: inline-block;
+    padding: 9px;
+}
+.treePropertiesWindowDiv:hover {
+    color: #787878;
+}
+
+#treePropertiesDiv {
+    border: 1px solid #000000;
+    border-radius: 5px;
+}
+.treePropertiesDivDivs {
+    padding: 6px 8px 6px 8px;
+    border-radius: 5px;
+}
+
+#treePropertiesDivButtons {
+    padding: 9px;
+    display: flex;
+    justify-content: right;
+    align-items: center;
+}
+#treePropertiesDivButtons {
+    text-align: center;
+}
+.treePropertiesDivButton {
+    margin: 3px 3px 3px 15px;
+    cursor: pointer;
+    display: inline-block;
+}
+.treePropertiesDivButton:hover {
+    color: #787878;
+}