push sources 16.03.2022 #1
parent
463b81f549
commit
2a04cd6515
@ -1,20 +0,0 @@
|
|||||||
{
|
|
||||||
"responsive-preview": {
|
|
||||||
"Mobile": [
|
|
||||||
320,
|
|
||||||
675
|
|
||||||
],
|
|
||||||
"Tablet": [
|
|
||||||
1024,
|
|
||||||
765
|
|
||||||
],
|
|
||||||
"Desktop": [
|
|
||||||
1400,
|
|
||||||
800
|
|
||||||
],
|
|
||||||
"Desktop HD": [
|
|
||||||
1920,
|
|
||||||
1080
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,7 +1,7 @@
|
|||||||
|
|
||||||
|
|
||||||
start:
|
start:
|
||||||
npm install && npm start
|
npm install && npm start
|
||||||
|
|
||||||
build:
|
build:
|
||||||
npm install && npm run build ../web
|
npm install && nom build
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,82 @@
|
|||||||
|
import React from "react";
|
||||||
|
import ReactDOM from "react-dom";
|
||||||
|
|
||||||
|
export default class TabsView extends React.Component {
|
||||||
|
menuBtn = {
|
||||||
|
all: {
|
||||||
|
borderBottom: "1px solid #AAA",
|
||||||
|
background: "#1d1d1d",
|
||||||
|
color: "#FFF",
|
||||||
|
textDecoration: "none",
|
||||||
|
marginLeft: "0px",
|
||||||
|
padding: " 10px",
|
||||||
|
borderRight: "1px solid #FFF",
|
||||||
|
cursor: "pointer",
|
||||||
|
position: "ralative",
|
||||||
|
//left: "-40px",
|
||||||
|
borderRadius: "0px 20px 0px 20px",
|
||||||
|
left: "-20px"
|
||||||
|
//borderRadius: "10px 20px 0px 0px"
|
||||||
|
},
|
||||||
|
active: {
|
||||||
|
background: "blue",
|
||||||
|
//color: "#FFF",
|
||||||
|
textDecoration: "none",
|
||||||
|
marginLeft: "0px",
|
||||||
|
padding: " 10px",
|
||||||
|
borderRight: "1px solid #FFF",
|
||||||
|
cursor: "pointer",
|
||||||
|
position: "ralative",
|
||||||
|
left: "-40px"
|
||||||
|
}
|
||||||
|
};
|
||||||
|
active = this.props.menuButton[this.props.activeDefault];
|
||||||
|
|
||||||
|
chechActive(id) {
|
||||||
|
for (let p = 0; p < this.props.menuButton.length; p++) {
|
||||||
|
if (this.props.menuButton[p].id === this.active) {
|
||||||
|
document.getElementById(this.props.menuButton[p].id).style.background =
|
||||||
|
"#00F";
|
||||||
|
} else {
|
||||||
|
document.getElementById(
|
||||||
|
this.props.menuButton[p].id
|
||||||
|
).style.background = this.menuBtn.all.background;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
// className="btn-group"
|
||||||
|
style={{
|
||||||
|
display: "inline-flex",
|
||||||
|
margin: "0px",
|
||||||
|
marginTop: "20px",
|
||||||
|
|
||||||
|
fontSize: "1.2em"
|
||||||
|
|
||||||
|
// color: "#000"
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{this.props.menuButton.map((it, p) => (
|
||||||
|
<div
|
||||||
|
id={it.id}
|
||||||
|
style={this.menuBtn.all}
|
||||||
|
onClick={() => (
|
||||||
|
(this.active = it.id),
|
||||||
|
this.chechActive(it.text),
|
||||||
|
console.log(this.active),
|
||||||
|
ReactDOM.render(
|
||||||
|
this.props.menuButton[p].handler(),
|
||||||
|
document.getElementById("listOve")
|
||||||
|
)
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{it.text}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,13 @@
|
|||||||
|
import React from "react";
|
||||||
|
|
||||||
|
export default class AudioPlayer extends React.Component {
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<audio controls>
|
||||||
|
<source src={this.props.source} />
|
||||||
|
</audio>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,13 @@
|
|||||||
|
import React from "react";
|
||||||
|
|
||||||
|
export default class VideoPlayer extends React.Component {
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<video controls>
|
||||||
|
<source src={this.props.source} />
|
||||||
|
</video>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -1,20 +0,0 @@
|
|||||||
{
|
|
||||||
"responsive-preview": {
|
|
||||||
"Mobile": [
|
|
||||||
320,
|
|
||||||
675
|
|
||||||
],
|
|
||||||
"Tablet": [
|
|
||||||
1024,
|
|
||||||
765
|
|
||||||
],
|
|
||||||
"Desktop": [
|
|
||||||
1400,
|
|
||||||
800
|
|
||||||
],
|
|
||||||
"Desktop HD": [
|
|
||||||
1920,
|
|
||||||
1080
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,21 +0,0 @@
|
|||||||
# See https://help.github.com/ignore-files/ for more about ignoring files.
|
|
||||||
|
|
||||||
# dependencies
|
|
||||||
/node_modules
|
|
||||||
|
|
||||||
# testing
|
|
||||||
/coverage
|
|
||||||
|
|
||||||
# production
|
|
||||||
/build
|
|
||||||
|
|
||||||
# misc
|
|
||||||
.DS_Store
|
|
||||||
.env.local
|
|
||||||
.env.development.local
|
|
||||||
.env.test.local
|
|
||||||
.env.production.local
|
|
||||||
|
|
||||||
npm-debug.log*
|
|
||||||
yarn-debug.log*
|
|
||||||
yarn-error.log*
|
|
@ -1,7 +0,0 @@
|
|||||||
|
|
||||||
|
|
||||||
start:
|
|
||||||
npm install && npm start
|
|
||||||
|
|
||||||
build:
|
|
||||||
npm install && nom build
|
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,27 +0,0 @@
|
|||||||
{
|
|
||||||
"recpvers": null,
|
|
||||||
"dependencies": {
|
|
||||||
"axios": "0.24.0",
|
|
||||||
"react": "17.0.2",
|
|
||||||
"react-dom": "17.0.2",
|
|
||||||
"react-id-swiper": "4.0.0",
|
|
||||||
"react-id-swiper2": "1.0.7",
|
|
||||||
"react-pro-sidebar": "0.6.0",
|
|
||||||
"react-router-dom": "5.2.0",
|
|
||||||
"react-token-auth": "2.3.8"
|
|
||||||
},
|
|
||||||
"name": "webport-main",
|
|
||||||
"description": "",
|
|
||||||
"version": "0.0.1876",
|
|
||||||
"devDependencies": {
|
|
||||||
"electron": "^15.1.1",
|
|
||||||
"react-scripts": "1.0.0"
|
|
||||||
},
|
|
||||||
"scripts": {
|
|
||||||
"start": "react-scripts start",
|
|
||||||
"build": "react-scripts build",
|
|
||||||
"test": "react-scripts test --env=jsdom",
|
|
||||||
"eject": "react-scripts eject"
|
|
||||||
},
|
|
||||||
"keywords": []
|
|
||||||
}
|
|
Before Width: | Height: | Size: 24 KiB |
@ -1,44 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="ru">
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<meta
|
|
||||||
name="viewport"
|
|
||||||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
|
||||||
/>
|
|
||||||
<meta name="theme-color" content="#000000" />
|
|
||||||
<!--
|
|
||||||
manifest.json provides metadata used when your web app is added to the
|
|
||||||
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
|
|
||||||
-->
|
|
||||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
|
||||||
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
|
|
||||||
<!--
|
|
||||||
Notice the use of %PUBLIC_URL% in the tags above.
|
|
||||||
It will be replaced with the URL of the `public` folder during the build.
|
|
||||||
Only files inside the `public` folder can be referenced from the HTML.
|
|
||||||
|
|
||||||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
|
||||||
work correctly both with client-side routing and a non-root public URL.
|
|
||||||
Learn how to configure a non-root public URL by running `npm run build`.
|
|
||||||
-->
|
|
||||||
<title>Webport</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<head>
|
|
||||||
<title</title>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<div id="root"></div>
|
|
||||||
|
|
||||||
<!--
|
|
||||||
This HTML file is a template.
|
|
||||||
If you open it directly in the browser, you will see an empty page.
|
|
||||||
|
|
||||||
You can add webfonts, meta tags, or analytics to this file.
|
|
||||||
The build step will place the bundled scripts into the <body> tag.
|
|
||||||
|
|
||||||
To begin the development, run `npm start` or `yarn start`.
|
|
||||||
To create a production bundle, use `npm run build` or `yarn build`.
|
|
||||||
--></body>
|
|
||||||
</html>
|
|
@ -1,15 +0,0 @@
|
|||||||
{
|
|
||||||
"short_name": "React App",
|
|
||||||
"name": "Create React App Sample",
|
|
||||||
"icons": [
|
|
||||||
{
|
|
||||||
"src": "favicon.ico",
|
|
||||||
"sizes": "192x192",
|
|
||||||
"type": "image/png"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
"start_url": "./index.html",
|
|
||||||
"display": "standalone",
|
|
||||||
"theme_color": "#000000",
|
|
||||||
"background_color": "#ffffff"
|
|
||||||
}
|
|
@ -1,20 +0,0 @@
|
|||||||
{
|
|
||||||
"responsive-preview": {
|
|
||||||
"Mobile": [
|
|
||||||
320,
|
|
||||||
675
|
|
||||||
],
|
|
||||||
"Tablet": [
|
|
||||||
1024,
|
|
||||||
765
|
|
||||||
],
|
|
||||||
"Desktop": [
|
|
||||||
1400,
|
|
||||||
800
|
|
||||||
],
|
|
||||||
"Desktop HD": [
|
|
||||||
1920,
|
|
||||||
1080
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,52 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import "./style.css";
|
|
||||||
export default class Accordion extends React.Component {
|
|
||||||
style = {
|
|
||||||
uptitle: {
|
|
||||||
ontSize: "1.6em",
|
|
||||||
padding: "5px",
|
|
||||||
cursor: "pointer"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
ViewGroup(id) {
|
|
||||||
if (document.getElementById(id + "_group").style.display === "none") {
|
|
||||||
document.getElementById(id + "_group").style.display = " block";
|
|
||||||
document.getElementById(id + "_ch").textContent = "";
|
|
||||||
} else {
|
|
||||||
document.getElementById(id + "_group").style.display = "none";
|
|
||||||
document.getElementById(id + "_ch").textContent = "...";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
paddingLeft: "10px",
|
|
||||||
border: "1px dotted #CCC",
|
|
||||||
display: "grid"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
id={this.props.title}
|
|
||||||
class="Accrordion"
|
|
||||||
onClick={() => this.ViewGroup(this.props.title)}
|
|
||||||
>
|
|
||||||
<h3>
|
|
||||||
<b>
|
|
||||||
{this.props.title}{" "}
|
|
||||||
<span id={this.props.title + "_ch"}>{"..."}</span>
|
|
||||||
</b>
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
id={this.props.title + "_group"}
|
|
||||||
style={{ display: "none", cursor: "pointer" }}
|
|
||||||
>
|
|
||||||
<div>{this.props.children}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,371 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import NavBar from "./NavList/navList";
|
|
||||||
import AuthForm from "../pages/auth/auth";
|
|
||||||
import MainPage from "../pages/main";
|
|
||||||
import FullCard from "../Componets/Cards/fullCard";
|
|
||||||
//import OverlaPage from "../pages/overlays";
|
|
||||||
import "./style.css";
|
|
||||||
import ReactDOM from "react-dom";
|
|
||||||
//import { useState } from "react";
|
|
||||||
|
|
||||||
export default class AppContainer extends React.Component {
|
|
||||||
ui = {
|
|
||||||
BackButton: {
|
|
||||||
text: "Назад"
|
|
||||||
},
|
|
||||||
button: {
|
|
||||||
sync: {
|
|
||||||
text: "Обновить",
|
|
||||||
icon:
|
|
||||||
"https://cdn.icon-icons.com/icons2/3168/PNG/512/refresh_arrow_arrows_icon_193535.png"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
//VSB = document.getElementById("navbar")style.display
|
|
||||||
Ptitle = () => this.viewSideBar();
|
|
||||||
|
|
||||||
findPakg(pkg) {
|
|
||||||
this.viewPakegeInfo(pkg);
|
|
||||||
}
|
|
||||||
|
|
||||||
viewPakegeInfo(pkgName) {
|
|
||||||
const url = this.props.ServerAddress + "/find?pkg=" + pkgName;
|
|
||||||
const response = fetch(url);
|
|
||||||
/*try {
|
|
||||||
portage_list[pkgName];
|
|
||||||
} catch (e) {*/
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
// если HTTP-статус в диапазоне 200-299
|
|
||||||
// получаем тело ответа (см. про этот метод ниже)
|
|
||||||
let res = response.json();
|
|
||||||
ReactDOM.render(
|
|
||||||
<FullCard
|
|
||||||
PackageName={res}
|
|
||||||
PropMain={this.props.rec}
|
|
||||||
icons={this.props.icons}
|
|
||||||
/>,
|
|
||||||
document.getElementById("HomePage")
|
|
||||||
);
|
|
||||||
document.getElementById("inS").value = "";
|
|
||||||
} else {
|
|
||||||
console.log("Ошибка HTTP: " + response.status);
|
|
||||||
//}
|
|
||||||
}
|
|
||||||
|
|
||||||
console.log(pkgName);
|
|
||||||
}
|
|
||||||
|
|
||||||
toBack() {
|
|
||||||
document.getElementById("backBtn").style.display = "none";
|
|
||||||
//document.getElementById("containerInfo").style.display = "none";
|
|
||||||
document.getElementById("container").style.display = "block";
|
|
||||||
document.getElementById("pTitle").textContent = this.ViewTitle();
|
|
||||||
document.getElementById("pTitle").textContent = "Главная";
|
|
||||||
ReactDOM.render(
|
|
||||||
<MainPage
|
|
||||||
icons={this.props.icons}
|
|
||||||
rec={this.props.rec}
|
|
||||||
useDes={this.props.useDes}
|
|
||||||
Ipkg={this.props.Ipkg}
|
|
||||||
repositores={this.props.repositores}
|
|
||||||
/>,
|
|
||||||
document.getElementById("HomePage")
|
|
||||||
);
|
|
||||||
|
|
||||||
//window.location.reload();
|
|
||||||
//this.ViewTitle();
|
|
||||||
//document.getElementById('pTitle').textContent = this.props.menuItems[]
|
|
||||||
}
|
|
||||||
|
|
||||||
viewSideBar() {
|
|
||||||
// Появление меню слева
|
|
||||||
if (document.getElementById("navbar").style.display !== "none") {
|
|
||||||
// document.getElementById("MainContent").style.paddingLeft = "300px";
|
|
||||||
// document.getElementById("MainContent").width = -"300px";
|
|
||||||
//document.getElementById("container").style.width =
|
|
||||||
// String(document.querySelector(".container").offsetWidth - 300) + "px";
|
|
||||||
console.log("on");
|
|
||||||
//console.log(document.querySelector(".page-content").offsetWidth);
|
|
||||||
//document.getElementById("btn-toggle").style.paddingLeft = "270px";
|
|
||||||
//document.getElementById("btn-toggle").style.float = "right";
|
|
||||||
document.getElementById("navBar").style.display = "none";
|
|
||||||
//this.VVSB = true;
|
|
||||||
} else {
|
|
||||||
//document.getElementById("MainContent").style.paddingLeft = "0px";
|
|
||||||
//document.getElementById("container").style.width =
|
|
||||||
// String(document.querySelector(".container").offsetWidth + 300) + "px";
|
|
||||||
|
|
||||||
//document.getElementById("btn-toggle").style.paddingLeft = "0px";
|
|
||||||
document.getElementById("navBar").style.display = "block"; //left: "-300px";
|
|
||||||
console.log("off");
|
|
||||||
//console.log(document.querySelector(".container").offsetWidth);
|
|
||||||
//this.VVSB = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
btnMenu() {
|
|
||||||
return (
|
|
||||||
<li>
|
|
||||||
<svg
|
|
||||||
c
|
|
||||||
style={{
|
|
||||||
float: "left",
|
|
||||||
paddingLeft: "20px",
|
|
||||||
paddingRight: "10px"
|
|
||||||
}}
|
|
||||||
//onClick={() => this.viewSideBar()}
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="currentColor"
|
|
||||||
stroke-width="0"
|
|
||||||
viewBox="0 0 448 512"
|
|
||||||
height="1.4em"
|
|
||||||
width="1.4em"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path>
|
|
||||||
</svg>
|
|
||||||
</li>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
ViewTitle() {
|
|
||||||
// Имя заголовка меню
|
|
||||||
for (let i = 0; i > this.props.menuItems.length; i++) {
|
|
||||||
if (
|
|
||||||
this.props.menuItems[i].url ===
|
|
||||||
window.location.href.split(window.location.host)[1]
|
|
||||||
//this.props.menuItems[i].url
|
|
||||||
//window.location.href.split(window.location.host)[1]
|
|
||||||
) {
|
|
||||||
//document.getElementById("pTitle").textContent = this.props.menuItems[i].text;
|
|
||||||
this.pTitle = this.props.menuItems[i].text;
|
|
||||||
}
|
|
||||||
console.log(this.title);
|
|
||||||
return (this.pTitle = this.props.menuItems[i].text);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
//this.ViewTitle();
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<AuthForm />
|
|
||||||
|
|
||||||
<div className="page-wrapper chiller-theme toggled">
|
|
||||||
<ul
|
|
||||||
// Верхняя полоса
|
|
||||||
id="btn-toggle"
|
|
||||||
class="btn-toggle"
|
|
||||||
style={{
|
|
||||||
display: "inline",
|
|
||||||
padding: "5px 0px",
|
|
||||||
margin: "0px",
|
|
||||||
borderBottom: "1px solid #AAA",
|
|
||||||
width: "100%",
|
|
||||||
background: "#1d1d1d", //"#2e323f",
|
|
||||||
//"1d1d1d",
|
|
||||||
// "#2e323f",
|
|
||||||
position: "fixed",
|
|
||||||
top: "0",
|
|
||||||
color: "#FFF",
|
|
||||||
zIndex: "1",
|
|
||||||
listStyle: "none"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{}
|
|
||||||
<li>
|
|
||||||
<span
|
|
||||||
// Кнопка назад
|
|
||||||
className="btn"
|
|
||||||
id="backBtn"
|
|
||||||
style={{
|
|
||||||
padding: "0px 20px 0px 20px",
|
|
||||||
float: "left",
|
|
||||||
color: "#AAA",
|
|
||||||
background: "#FFF",
|
|
||||||
marginRight: "0.85em",
|
|
||||||
fontSize: "1.6em",
|
|
||||||
borderRadius: "0.9em"
|
|
||||||
//border: "1px outset #444",
|
|
||||||
//background: "rgb(78,116,26)",
|
|
||||||
//background: "rgb(78,116,26)",
|
|
||||||
//background:
|
|
||||||
// "linear-gradient(0deg, rgba(78,116,26,0.5536415249693627) 0%, rgba(229,237,235,0.9093838218881303) 35%)"
|
|
||||||
|
|
||||||
//borderRadius: ".9em"
|
|
||||||
}}
|
|
||||||
onClick={() => this.toBack()}
|
|
||||||
></span>
|
|
||||||
</li>
|
|
||||||
{navigator.userAgentData.mobile
|
|
||||||
? this.btnMenu()
|
|
||||||
: console.log("desktop")}
|
|
||||||
{/*
|
|
||||||
<b>
|
|
||||||
<div
|
|
||||||
id="pTitle"
|
|
||||||
// Заголовок окна. Имеется глюк в том,
|
|
||||||
// что имя окна не появляется при обновлении страницы
|
|
||||||
style={{
|
|
||||||
float: "left",
|
|
||||||
width: "50vw",
|
|
||||||
marginleft: "20px",
|
|
||||||
textAlign: "center",
|
|
||||||
fontSize: "1.4em",
|
|
||||||
color: "#FFF"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{this.PackageName}
|
|
||||||
</div>
|
|
||||||
</b>
|
|
||||||
*/}
|
|
||||||
{}
|
|
||||||
<li>
|
|
||||||
<NavBar
|
|
||||||
style={{ display: "inline" }}
|
|
||||||
ServerAddress={this.props.ServerAddress}
|
|
||||||
category={this.props.category}
|
|
||||||
menuItem={this.props.menuItems}
|
|
||||||
aliases={this.props.aliases}
|
|
||||||
Ipkgs={this.props.Ipkg}
|
|
||||||
/>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<div
|
|
||||||
className="d6"
|
|
||||||
style={{ position: "realative", float: "right", right: "20px" }}
|
|
||||||
>
|
|
||||||
<form>
|
|
||||||
<input
|
|
||||||
// Кнопка поиска
|
|
||||||
id="inS"
|
|
||||||
name="inS"
|
|
||||||
classname="form-control"
|
|
||||||
type="text"
|
|
||||||
placeholder="Введите имя пакета"
|
|
||||||
onChange={(e) => this.findPakg(e.target.value)}
|
|
||||||
style={{
|
|
||||||
/* fontSize: "1.2em",
|
|
||||||
margin: "10px", */
|
|
||||||
//backgroundColor: "rgba(81, 81, 81, 0.5)",
|
|
||||||
|
|
||||||
border: "none",
|
|
||||||
//padding: "5px",
|
|
||||||
//ackground: "#2e233f",
|
|
||||||
//borderRadius: "15px",
|
|
||||||
//border: "3px inset #2e322f",
|
|
||||||
color: "#c7c7c7"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
{/*}
|
|
||||||
<div className="button">
|
|
||||||
<svg
|
|
||||||
style={{ color: "#FFF" }}
|
|
||||||
class="l-ss-c-element"
|
|
||||||
width="18"
|
|
||||||
height="27"
|
|
||||||
viewBox="0 0 18 27"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
{" "}
|
|
||||||
<path
|
|
||||||
class="l-ss-c-element"
|
|
||||||
fill="#FFF"
|
|
||||||
fill-rule="#FFF"
|
|
||||||
clip-rull="#FFF"
|
|
||||||
//fill-rule="evenodd"
|
|
||||||
//clip-rule="evenodd"
|
|
||||||
d="M11.1897 5.44196V11.9907C11.1897 13.1717 10.2323 14.1291 9.05126 14.1291C7.87025 14.1291 6.91286 13.1717 6.91286 11.9907V5.44196C6.91286 4.26095 7.87026 3.30355 9.05126 3.30355C10.2323 3.30355 11.1897 4.26095 11.1897 5.44196ZM4.37359 5.44196C4.37359 2.85855 6.46786 0.764282 9.05126 0.764282C11.6347 0.764282 13.7289 2.85855 13.7289 5.44196V11.9907C13.7289 14.5741 11.6347 16.6684 9.05126 16.6684C6.46786 16.6684 4.37359 14.5741 4.37359 11.9907V5.44196ZM2.83614 11.0551C2.83614 10.3539 2.26771 9.78547 1.56651 9.78547C0.865309 9.78547 0.296875 10.3539 0.296875 11.0551V12.9262C0.296875 17.3295 3.548 20.9735 7.78077 21.5886V23.8185H6.712C6.0108 23.8185 5.44236 24.387 5.44236 25.0882C5.44236 25.7894 6.0108 26.3578 6.712 26.3578H11.3897C12.0909 26.3578 12.6593 25.7894 12.6593 25.0882C12.6593 24.387 12.0909 23.8185 11.3897 23.8185H10.32V21.5887C14.5532 20.9739 17.8047 17.3298 17.8047 12.9262V11.0551C17.8047 10.3539 17.2363 9.78547 16.5351 9.78547C15.8339 9.78547 15.2654 10.3539 15.2654 11.0551V12.9262C15.2654 16.3584 12.483 19.1408 9.05079 19.1408C5.61853 19.1408 2.83614 16.3584 2.83614 12.9262V11.0551Z"
|
|
||||||
></path>{" "}
|
|
||||||
</svg>
|
|
||||||
</div>*/}
|
|
||||||
<div
|
|
||||||
// className="btn-group"
|
|
||||||
>
|
|
||||||
{
|
|
||||||
// <div className="button search"></div>
|
|
||||||
}
|
|
||||||
<div
|
|
||||||
className="button"
|
|
||||||
style={{
|
|
||||||
justifyContent: "center"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<svg
|
|
||||||
class="l-ss-c-element"
|
|
||||||
width="19"
|
|
||||||
height="20"
|
|
||||||
viewBox="0 0 19 20"
|
|
||||||
fill="none"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
{" "}
|
|
||||||
<path
|
|
||||||
class="l-ss-c-element"
|
|
||||||
fill-rule="evenodd"
|
|
||||||
clip-rule="evenodd"
|
|
||||||
d="M14.3074 8.03846C14.3074 11.3734 11.6039 14.0769 8.26893 14.0769C4.93398 14.0769 2.23047 11.3734 2.23047 8.03846C2.23047 4.70351 4.93398 2 8.26893 2C11.6039 2 14.3074 4.70351 14.3074 8.03846ZM12.331 14.9766C11.139 15.6759 9.75081 16.0769 8.26893 16.0769C3.82941 16.0769 0.230469 12.478 0.230469 8.03846C0.230469 3.59894 3.82941 0 8.26893 0C12.7085 0 16.3074 3.59894 16.3074 8.03846C16.3074 10.2703 15.3978 12.2897 13.9291 13.7463L18.4758 18.2929C18.8663 18.6834 18.8663 19.3166 18.4758 19.7071C18.0853 20.0977 17.4521 20.0977 17.0616 19.7071L12.331 14.9766Z"
|
|
||||||
fill="white"
|
|
||||||
></path>{" "}
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<main
|
|
||||||
id="MainContent"
|
|
||||||
className="page-content"
|
|
||||||
style={{
|
|
||||||
paddingLeft: "10px",
|
|
||||||
margin: "0px",
|
|
||||||
width: "100vw",
|
|
||||||
height: "100vh",
|
|
||||||
//background: "#1d1d1d",
|
|
||||||
overflow: "scroll",
|
|
||||||
color: "#000"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
id="containerInfo"
|
|
||||||
style={{
|
|
||||||
position: "fixed",
|
|
||||||
//navigator.userAgentData.mobile ? width"100vw": width="20vw"
|
|
||||||
|
|
||||||
width: "100vw",
|
|
||||||
height: "100vh",
|
|
||||||
display: "none",
|
|
||||||
background: "#1D1D1D",
|
|
||||||
overflowY: "scroll",
|
|
||||||
color: "#FFF",
|
|
||||||
right: "0px", //background: "#2e323f"
|
|
||||||
//color: "#AAA"
|
|
||||||
borderLeft: "1px solid #CCC",
|
|
||||||
marginTop: "20px"
|
|
||||||
|
|
||||||
//paddingLeft: "5px"
|
|
||||||
//marginBottom: "20px"
|
|
||||||
}}
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
id="container"
|
|
||||||
className="container"
|
|
||||||
style={{
|
|
||||||
//float: "left",
|
|
||||||
padding: "0px",
|
|
||||||
width: "100vw",
|
|
||||||
height: "100vh",
|
|
||||||
position: "fixed",
|
|
||||||
overflow: "scroll",
|
|
||||||
marginTop: "38px"
|
|
||||||
// width: "400px"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{this.props.children}
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,50 +0,0 @@
|
|||||||
import "./style.css";
|
|
||||||
import React from "react";
|
|
||||||
export default class OverlayCard extends React.Component {
|
|
||||||
toBack() {
|
|
||||||
document.getElementById("pTitle").textContent = "Оверлеи";
|
|
||||||
document.getElementById("containerInfo").style.display = "none";
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div className="sCard" style={{}}>
|
|
||||||
<h3 style={{}}>
|
|
||||||
<span
|
|
||||||
className="btn"
|
|
||||||
id="backBtn"
|
|
||||||
style={{
|
|
||||||
padding: "0px 20px 0px 20px",
|
|
||||||
float: "left",
|
|
||||||
color: "#FFF",
|
|
||||||
background: "#F00",
|
|
||||||
marginRight: "0.85em",
|
|
||||||
fontSize: "1.1em",
|
|
||||||
borderRadius: "0.9em"
|
|
||||||
|
|
||||||
//border: "1px outset #444",
|
|
||||||
//background: "rgb(78,116,26)",
|
|
||||||
// background: "rgb(78,116,26)",
|
|
||||||
//background:
|
|
||||||
// "linear-gradient(0deg, rgba(78,116,26,0.5536415249693627) 0%, rgba(229,237,235,0.9093838218881303) 35%)"
|
|
||||||
}}
|
|
||||||
onClick={() => this.toBack()}
|
|
||||||
>
|
|
||||||
<b style={{ float: "right" }}> {"X"}</b>
|
|
||||||
</span>
|
|
||||||
<b> {this.props.title.name}:</b> {this.props.OverlayInfo.name}
|
|
||||||
</h3>
|
|
||||||
<div>
|
|
||||||
<p style={{ fontSize: "1.4em" }}>
|
|
||||||
<b>{this.props.title.discription}:</b>
|
|
||||||
{this.props.OverlayInfo.description}
|
|
||||||
</p>
|
|
||||||
<iframe
|
|
||||||
style={{ width: "100%", height: " 100vh" }}
|
|
||||||
src={this.props.OverlayInfo.homepage}
|
|
||||||
seamless="false"
|
|
||||||
></iframe>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,93 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import ReactDOM from "react-dom";
|
|
||||||
import FullCard from "./fullCard";
|
|
||||||
//import PkgList from "../../pages/pks";
|
|
||||||
import "./style.css";
|
|
||||||
//import Swiper from "react-slider-swiper";
|
|
||||||
//import InstallForm from "../pages/InstallForm";
|
|
||||||
const ui = { description: "Описание" };
|
|
||||||
class Scard extends React.Component {
|
|
||||||
//Viewinstall(package) {
|
|
||||||
//const pkgInfo = this.props.rec[package]
|
|
||||||
//return <InstallForm rec={pkgInfo} />;
|
|
||||||
//}:
|
|
||||||
params = {
|
|
||||||
pagination: ".swiper-pagination",
|
|
||||||
paginationClickable: true,
|
|
||||||
nextButton: ".swiper-button-next",
|
|
||||||
prevButton: ".swiper-button-prev",
|
|
||||||
spaceBetween: 30,
|
|
||||||
runCallbacksOnInit: true,
|
|
||||||
onInit: (swiper) => {
|
|
||||||
this.swiper = swiper;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
viweinfo(pkg) {
|
|
||||||
//onClick={() => this.props.ViewPackageInfo(this.props.rec[k][i])}
|
|
||||||
document.getElementById("backBtn").style.display = "block";
|
|
||||||
document.getElementById("pTitle").textContent = pkg.Name.split("/")[1];
|
|
||||||
document.getElementById("container").style.display = "none";
|
|
||||||
|
|
||||||
document.getElementById("containerInfo").style.display = "block";
|
|
||||||
ReactDOM.render(
|
|
||||||
<FullCard
|
|
||||||
PackageName={pkg}
|
|
||||||
PropMain={this.props.rec}
|
|
||||||
icons={this.props.icons}
|
|
||||||
useDes={this.props.useDes}
|
|
||||||
Ipkg={this.props.Ipkg}
|
|
||||||
/>,
|
|
||||||
document.getElementById("containerInfo")
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="card__list"
|
|
||||||
style={{
|
|
||||||
padding: "5px",
|
|
||||||
//margin: "3px",
|
|
||||||
marginTop: "10px",
|
|
||||||
//width: "100vw",
|
|
||||||
display: "inline-flex",
|
|
||||||
border: "1px solid #CCC",
|
|
||||||
borderRadius: " 10px",
|
|
||||||
boxShadow: "3px 4px 10px #CDC"
|
|
||||||
//height:"75px"
|
|
||||||
}}
|
|
||||||
//onClick={() => this.viweinfo(this.props.rec[k][i])}
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
className="card__img"
|
|
||||||
style={{
|
|
||||||
width: "64px",
|
|
||||||
height: "64px"
|
|
||||||
}}
|
|
||||||
src={this.props.icons[this.props.pn.Name.split("/")[1]]}
|
|
||||||
alt={this.props.pn.Name.split("/")[1]}
|
|
||||||
/>
|
|
||||||
<div style={{ marginLeft: "10px" }}>
|
|
||||||
<b>
|
|
||||||
{" "}
|
|
||||||
<span
|
|
||||||
className="card__title"
|
|
||||||
style={{
|
|
||||||
color: "red",
|
|
||||||
width: "100vw",
|
|
||||||
overflow: "clip",
|
|
||||||
fontSize: "1.1em"
|
|
||||||
}}
|
|
||||||
key={this.props.pn.Name}
|
|
||||||
>
|
|
||||||
{this.props.pn.Name.split("/")[1]}
|
|
||||||
</span>
|
|
||||||
</b>
|
|
||||||
<div style={{ overflow: "hidden" }}>{this.props.pn.Description}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default Scard;
|
|
@ -1,76 +0,0 @@
|
|||||||
.sCard {
|
|
||||||
padding: 5px;
|
|
||||||
font-size: 1.2em;
|
|
||||||
text-align: left;
|
|
||||||
/*border-bottom: 1px solid #aaa;*/
|
|
||||||
}
|
|
||||||
.sCard:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
.cTitle {
|
|
||||||
padding-top: 0px;
|
|
||||||
margin: 0px;
|
|
||||||
font: 20px bold;
|
|
||||||
text-align: center;
|
|
||||||
border-bottom: 1px solid #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sUse {
|
|
||||||
display: flow-root;
|
|
||||||
}
|
|
||||||
.sUse span {
|
|
||||||
list-style: none;
|
|
||||||
display: inline-flex;
|
|
||||||
padding: 5px;
|
|
||||||
}
|
|
||||||
.sUse span:hover {
|
|
||||||
background: orange;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cVer {
|
|
||||||
display: flow-root;
|
|
||||||
}
|
|
||||||
.cVer li {
|
|
||||||
list-style: none;
|
|
||||||
padding-left: 5px;
|
|
||||||
}
|
|
||||||
.cVer li:hover {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.card__img {
|
|
||||||
object-fit: contain;
|
|
||||||
}
|
|
||||||
|
|
||||||
.Btm {
|
|
||||||
position: fixed;
|
|
||||||
bottom: 20px;
|
|
||||||
right: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn {
|
|
||||||
float: right;
|
|
||||||
padding: 5px;
|
|
||||||
background: rgba(125, 122, 255, 1);
|
|
||||||
box-shadow: 0 0 3 #000;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.green {
|
|
||||||
background: #0f0;
|
|
||||||
margin: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.red {
|
|
||||||
background: #f00;
|
|
||||||
margin: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.descrition {
|
|
||||||
display: flexbox;
|
|
||||||
}
|
|
||||||
|
|
||||||
.useInfo {
|
|
||||||
margin: 10px;
|
|
||||||
}
|
|
@ -1,24 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
|
|
||||||
export default class CheckField extends React.Component {
|
|
||||||
check = this.props.checking;
|
|
||||||
chengeStatus(id) {
|
|
||||||
this.check = !this.check;
|
|
||||||
document.getElementById(id).checked = this.check;
|
|
||||||
return !this.check;
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<p onClick={() => this.chengeStatus(this.props.id)}>
|
|
||||||
<span> {this.props.text}</span>
|
|
||||||
<input
|
|
||||||
id={this.props.id}
|
|
||||||
style={{ float: "right" }}
|
|
||||||
type="checkbox"
|
|
||||||
checked={this.check}
|
|
||||||
//onClick={() => this.chengeStatus(this.props.id)}
|
|
||||||
/>
|
|
||||||
</p>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,57 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
//import MainPage from "..//../pages/main";
|
|
||||||
export default class MainContainer extends React.Component {
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
const VVSB = false;
|
|
||||||
// const [VVSBar, seViewSidebar] = useState(false);
|
|
||||||
}
|
|
||||||
viewSideBar() {
|
|
||||||
if (!this.VVSB) {
|
|
||||||
document.getElementById("MainContent").style.paddingLeft = "300px";
|
|
||||||
document.getElementById("btn-toggle").style.float = "right";
|
|
||||||
document.getElementById("navBar").style.left = "300px";
|
|
||||||
this.VVSB = true;
|
|
||||||
} else {
|
|
||||||
document.getElementById("MainContent").style.paddingLeft = "0px";
|
|
||||||
document.getElementById("navBar").style.left = "-280px";
|
|
||||||
this.VVSB = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div className="page-wrapper chiller-theme toggled">
|
|
||||||
<main
|
|
||||||
id="MainContent"
|
|
||||||
className="page-content"
|
|
||||||
style={{ paddingLeft: "0px" }}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
id="btn-toggle"
|
|
||||||
class="btn-toggle"
|
|
||||||
onClick={() => this.viewSideBar()}
|
|
||||||
style={{}}
|
|
||||||
>
|
|
||||||
<svg
|
|
||||||
stroke="currentColor"
|
|
||||||
fill="currentColor"
|
|
||||||
stroke-width="0"
|
|
||||||
viewBox="0 0 448 512"
|
|
||||||
height="1em"
|
|
||||||
width="1em"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
>
|
|
||||||
<path d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<div className="container">
|
|
||||||
<h2 id="pageTitle" style={{ float: "left" }}>
|
|
||||||
{""}
|
|
||||||
</h2>
|
|
||||||
{this.props.children}
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,78 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import ReactDOM from "react-dom";
|
|
||||||
import FullCard from "./Cards/fullCard";
|
|
||||||
export default class ModalForm extends React.Component {
|
|
||||||
styles = {
|
|
||||||
modal: {
|
|
||||||
//padding: "50px",
|
|
||||||
background: "#1d1d1d",
|
|
||||||
color: "#FFF",
|
|
||||||
position: "fixed",
|
|
||||||
top: "50%",
|
|
||||||
left: "50%",
|
|
||||||
right: "0px",
|
|
||||||
WebkitTransform: "translate(50%, -50%)",
|
|
||||||
MsTransform: "translate(-50%, -50%)",
|
|
||||||
transform: "translate(-50%, -50%)",
|
|
||||||
boxShadow: "3px 4px 10px #AAA",
|
|
||||||
padding: "10px"
|
|
||||||
},
|
|
||||||
mobile: {
|
|
||||||
//padding: "50px",
|
|
||||||
background: "1d1d1d",
|
|
||||||
position: "fixed",
|
|
||||||
top: "0px",
|
|
||||||
left: "0px",
|
|
||||||
width: "100%",
|
|
||||||
height: "100%",
|
|
||||||
right: "0px",
|
|
||||||
WebkitTransform: "translate(50%, -50%)",
|
|
||||||
MsTransform: "translate(-50%, -50%)",
|
|
||||||
transform: "translate(-50%, -50%)",
|
|
||||||
boxShadow: "3px 4px 10px #AAA"
|
|
||||||
//padding: "10px"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
isMobile() {
|
|
||||||
return navigator.userAgentData.mobile;
|
|
||||||
}
|
|
||||||
closeFunc() {
|
|
||||||
ReactDOM.render(
|
|
||||||
<FullCard
|
|
||||||
PackageName={this.props.root}
|
|
||||||
PropMain={this.props.rec}
|
|
||||||
icons={this.props.icons}
|
|
||||||
useDes={this.props.useDes}
|
|
||||||
Ipkg={this.props.Ipkg}
|
|
||||||
/>,
|
|
||||||
document.getElementById("containerInfo")
|
|
||||||
);
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
id={this.props.title}
|
|
||||||
style={this.isMobile() ? this.styles.mobile : this.styles.modal}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
style={{ display: "inline", background: "#CDC", fontSize: "0.8m" }}
|
|
||||||
>
|
|
||||||
<span style={{ fontSize: "1.1em", float: "left", padding: "15px" }}>
|
|
||||||
{" "}
|
|
||||||
{this.props.title}
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<div className="btn-group">
|
|
||||||
<div
|
|
||||||
style={{ background: "#F00", color: "#FFF", float: "right" }}
|
|
||||||
onClick={() => this.closeFunc()}
|
|
||||||
>
|
|
||||||
X
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>{this.props.children}</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,321 +0,0 @@
|
|||||||
import React, { Component } from "react";
|
|
||||||
import ReactDOM from "react-dom";
|
|
||||||
//import axios from "axios";
|
|
||||||
import {
|
|
||||||
ProSidebar,
|
|
||||||
Menu,
|
|
||||||
MenuItem,
|
|
||||||
SubMenu,
|
|
||||||
SidebarHeader,
|
|
||||||
//SidebarFooter,
|
|
||||||
SidebarContent
|
|
||||||
} from "react-pro-sidebar";
|
|
||||||
//import "react-pro-sidebar/dist/css/styles.css";
|
|
||||||
import MenuPage from "../menu";
|
|
||||||
import "../../pages/style.css";
|
|
||||||
import FullCard from "../Cards/fullCard";
|
|
||||||
import UserProfilePage from "../../pages/profile";
|
|
||||||
//var view = false;
|
|
||||||
class NavBar extends Component {
|
|
||||||
user = { username: "Demo", userStatus: "Guest" };
|
|
||||||
|
|
||||||
ui = {
|
|
||||||
menu: {
|
|
||||||
text: "Меню"
|
|
||||||
},
|
|
||||||
catalog: {
|
|
||||||
text: "Каталог"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
styles = {
|
|
||||||
desktop: {
|
|
||||||
background: "2e323f",
|
|
||||||
//position: "ralative",
|
|
||||||
display: "inline",
|
|
||||||
//display: "none",
|
|
||||||
//height: "100%",
|
|
||||||
left: "-50px",
|
|
||||||
//width: "",
|
|
||||||
float: "left"
|
|
||||||
},
|
|
||||||
mobile: {
|
|
||||||
background: "2e323f",
|
|
||||||
position: "fixed",
|
|
||||||
display: "none",
|
|
||||||
height: "100%",
|
|
||||||
left: "300px",
|
|
||||||
width: "200px"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
viewMobile() {
|
|
||||||
return (
|
|
||||||
<ProSidebar
|
|
||||||
id="navBar"
|
|
||||||
style={{
|
|
||||||
height: "100vh",
|
|
||||||
marginTop: "40px"
|
|
||||||
|
|
||||||
/*
|
|
||||||
navigator.userAgentData.mobile
|
|
||||||
? this.styles.mobile
|
|
||||||
: this.styles.desktop
|
|
||||||
*/
|
|
||||||
// navigator.userAgentData.mobile
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<SidebarHeader>
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
padding: "24px",
|
|
||||||
textTransform: "uppercase",
|
|
||||||
fontWeight: "bold",
|
|
||||||
fontSize: "14px",
|
|
||||||
letterSpacing: "1px",
|
|
||||||
overflow: "hidden",
|
|
||||||
textOverflow: "ellipsis",
|
|
||||||
whiteSpace: "nowrap",
|
|
||||||
paddingLeft: "12px"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Webport
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<MenuItem>
|
|
||||||
<div
|
|
||||||
className="user-pic"
|
|
||||||
style={{
|
|
||||||
width: "60px",
|
|
||||||
marginRight: "3px",
|
|
||||||
float: "left",
|
|
||||||
paddingLeft: "12px"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
style={{ width: "56px", height: "56px", background: "green" }}
|
|
||||||
className="img-responsive img-rounded"
|
|
||||||
//src="https://raw.githubusercontent.com/azouaoui-med/pro-sidebar-template/gh-pages/src/img/user.jpg"
|
|
||||||
alt="User picture"
|
|
||||||
onClick={() => (
|
|
||||||
//(document.getElementById("backBtn").style.display = "block"),
|
|
||||||
//(document.getElementById("container").style.display = "none"),
|
|
||||||
(document.getElementById("containerInfo").style.display =
|
|
||||||
"block"),
|
|
||||||
ReactDOM.render(
|
|
||||||
<UserProfilePage
|
|
||||||
Ipkgs={this.props.Ipkgs}
|
|
||||||
catalog={this.props.category}
|
|
||||||
/>,
|
|
||||||
document.getElementById("containerInfo")
|
|
||||||
)
|
|
||||||
)}
|
|
||||||
></div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
className="user-info"
|
|
||||||
style={{ float: "left", width: " 100%" }}
|
|
||||||
>
|
|
||||||
<span className="user-name">{this.user.username}</span>
|
|
||||||
<span
|
|
||||||
className="user-role"
|
|
||||||
style={{ width: "100vw", color: "green" }}
|
|
||||||
>
|
|
||||||
{this.user.userStatus}
|
|
||||||
</span>
|
|
||||||
{/* <span className="user-status">
|
|
||||||
<i className="fa fa-circle"></i>
|
|
||||||
<span>Online</span>
|
|
||||||
</span>*/}
|
|
||||||
</div>
|
|
||||||
</MenuItem>
|
|
||||||
<MenuItem style={{}}>
|
|
||||||
{/* <input
|
|
||||||
id="inS"
|
|
||||||
name="inS"
|
|
||||||
classname="form-control"
|
|
||||||
type="text"
|
|
||||||
placeholder="Введите имя пакета"
|
|
||||||
onChange={(e) => this.findPakg(e.target.value)}
|
|
||||||
style={{
|
|
||||||
fontSize: "1.2em",
|
|
||||||
margin: "10px",
|
|
||||||
backgroundColor: "rgba(81, 81, 81, 0.5)",
|
|
||||||
border: "none",
|
|
||||||
padding: "5px",
|
|
||||||
//ackground: "#2e233f",
|
|
||||||
//borderRadius: "15px",
|
|
||||||
//border: "3px inset #2e322f",
|
|
||||||
color: "#c7c7c7"
|
|
||||||
}}
|
|
||||||
/>*/}
|
|
||||||
</MenuItem>
|
|
||||||
</SidebarHeader>
|
|
||||||
<SidebarContent style={{ overflowX: "clip" }}>
|
|
||||||
<Menu>
|
|
||||||
<MenuPage
|
|
||||||
menuItem={this.props.menuItem}
|
|
||||||
title={this.ui.menu.text}
|
|
||||||
/>
|
|
||||||
<MenuItem
|
|
||||||
title={this.ui.catalog.text}
|
|
||||||
style={{ paddingRight: "0px" }}
|
|
||||||
>
|
|
||||||
{/*CATALOG */}
|
|
||||||
|
|
||||||
<SubMenu title={this.ui.catalog.text}>
|
|
||||||
{Object.keys(this.props.category).map((k, i) => (
|
|
||||||
<MenuItem
|
|
||||||
style={{
|
|
||||||
paddingRight: "0px",
|
|
||||||
width: "100vw",
|
|
||||||
float: "left"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{
|
|
||||||
//
|
|
||||||
}
|
|
||||||
<SubMenu
|
|
||||||
title={
|
|
||||||
this.checkAlias(k) +
|
|
||||||
" (" +
|
|
||||||
this.props.category[k].length +
|
|
||||||
")"
|
|
||||||
}
|
|
||||||
>
|
|
||||||
{this.props.category[k].map((pn, j) => (
|
|
||||||
<MenuItem
|
|
||||||
onClick={() =>
|
|
||||||
this.viewPakegeInfo(
|
|
||||||
this.props.category[k][i] +
|
|
||||||
"/" +
|
|
||||||
this.props.category[k][j]
|
|
||||||
)
|
|
||||||
}
|
|
||||||
style={{
|
|
||||||
//borderBottom: "1px solid red ", 
|
|
||||||
width: "100%"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{
|
|
||||||
//
|
|
||||||
}
|
|
||||||
{pn}
|
|
||||||
</MenuItem>
|
|
||||||
))}
|
|
||||||
</SubMenu>
|
|
||||||
</MenuItem>
|
|
||||||
))}
|
|
||||||
</SubMenu>
|
|
||||||
</MenuItem>
|
|
||||||
</Menu>
|
|
||||||
</SidebarContent>
|
|
||||||
</ProSidebar>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
viewOther() {
|
|
||||||
return (
|
|
||||||
<Menu style={{ display: "inline", overflowY: "scroll", width: "200px" }}>
|
|
||||||
<MenuPage
|
|
||||||
menuItem={this.props.menuItem}
|
|
||||||
title={this.ui.menu.text}
|
|
||||||
style={{ paddingRight: "0px", float: "left" }}
|
|
||||||
/>
|
|
||||||
<MenuItem
|
|
||||||
title={this.ui.catalog.text}
|
|
||||||
style={{ paddingRight: "0px", float: "left", overflowY: "scroll" }}
|
|
||||||
>
|
|
||||||
{/*CATALOG */}
|
|
||||||
|
|
||||||
<SubMenu title={this.ui.catalog.text} style={{ overflowY: "scroll" }}>
|
|
||||||
{Object.keys(this.props.category).map((k, i) => (
|
|
||||||
<MenuItem
|
|
||||||
style={{
|
|
||||||
paddingRight: "0px",
|
|
||||||
width: "100vw"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{
|
|
||||||
//
|
|
||||||
}
|
|
||||||
<SubMenu
|
|
||||||
title={
|
|
||||||
this.checkAlias(k) +
|
|
||||||
" (" +
|
|
||||||
this.props.category[k].length +
|
|
||||||
")"
|
|
||||||
}
|
|
||||||
>
|
|
||||||
{this.props.category[k].map((pn, j) => (
|
|
||||||
<MenuItem
|
|
||||||
onClick={() =>
|
|
||||||
this.viewPakegeInfo(
|
|
||||||
this.props.category[k][i] +
|
|
||||||
"/" +
|
|
||||||
this.props.category[k][j]
|
|
||||||
)
|
|
||||||
}
|
|
||||||
style={{
|
|
||||||
//borderBottom: "1px solid red ", 
|
|
||||||
width: "100%"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{
|
|
||||||
//
|
|
||||||
}
|
|
||||||
{pn}
|
|
||||||
</MenuItem>
|
|
||||||
))}
|
|
||||||
</SubMenu>
|
|
||||||
</MenuItem>
|
|
||||||
))}
|
|
||||||
</SubMenu>
|
|
||||||
</MenuItem>
|
|
||||||
</Menu>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
checkAlias(text) {
|
|
||||||
//console.log( "aliases:\t" + this.props.aliases)
|
|
||||||
//return text;
|
|
||||||
if (text in this.props.aliases) {
|
|
||||||
return this.props.aliases[text];
|
|
||||||
//console.log(this.props.aliases[text]);
|
|
||||||
} else {
|
|
||||||
return text;
|
|
||||||
//console.log(e);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
viewPakegeInfo(pkgName) {
|
|
||||||
const url = this.props.ServerAdress + "/find?pkg=" + pkgName;
|
|
||||||
console.log(url, { mode: "no-cors" });
|
|
||||||
fetch(url, ["POST"])
|
|
||||||
.then((response) => response.json())
|
|
||||||
// .then(commits => alert(commits[0].author.login))
|
|
||||||
.catch((error) => {
|
|
||||||
console.error("Error:", error);
|
|
||||||
});
|
|
||||||
/*try {
|
|
||||||
portage_list[pkgName];
|
|
||||||
} catch (e) {*/
|
|
||||||
|
|
||||||
document.getElementById("containerInfo").display = "block";
|
|
||||||
ReactDOM.render(
|
|
||||||
<FullCard
|
|
||||||
PackageName={pkgName}
|
|
||||||
PropMain={this.props.rec}
|
|
||||||
icons={this.props.icons}
|
|
||||||
/>,
|
|
||||||
document.getElementById("containerInfo")
|
|
||||||
);
|
|
||||||
|
|
||||||
console.log(pkgName);
|
|
||||||
}
|
|
||||||
findPakg(pkg) {
|
|
||||||
this.viewPakegeInfo(pkg);
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return navigator.userAgentData.mobile
|
|
||||||
? this.viewMobile()
|
|
||||||
: this.viewOther();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default NavBar;
|
|
@ -1,568 +0,0 @@
|
|||||||
.NavBar {
|
|
||||||
user-select: none;
|
|
||||||
text-align: center;
|
|
||||||
height: 100%;
|
|
||||||
width: 11rem;
|
|
||||||
min-width: 12vw;
|
|
||||||
overflow-y: auto;
|
|
||||||
overflow-x: hidden;
|
|
||||||
color: var(--nav-color);
|
|
||||||
background-color: var(--nav-bg-color);
|
|
||||||
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
||||||
height: 100vh;
|
|
||||||
position: sticky;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
.NavBar li {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
position: relative;
|
|
||||||
font-size: 1rem;
|
|
||||||
padding-left: 1rem;
|
|
||||||
height: 2rem;
|
|
||||||
margin: 0 -1rem;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
outline: none;
|
|
||||||
cursor: pointer;
|
|
||||||
border-right: 3px solid transparent;
|
|
||||||
}
|
|
||||||
.categoryIcon {
|
|
||||||
margin-right: 0.5rem;
|
|
||||||
width: 1.2rem;
|
|
||||||
min-width: 1.2rem;
|
|
||||||
height: 1.2rem;
|
|
||||||
background-size: 100%;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position-x: 0, -100px;
|
|
||||||
}
|
|
||||||
.container {
|
|
||||||
width: 100vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
.visible {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.unvisible {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
@media screen and (max-width: 900px) {
|
|
||||||
ul.NavBar {
|
|
||||||
width: 50%;
|
|
||||||
|
|
||||||
/*width: 100%;*/
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (min-width: 480px) {
|
|
||||||
ul.NavBar li a {
|
|
||||||
width: 50%;
|
|
||||||
position: asboliute;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
ul {
|
|
||||||
list-style-type: none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
width: 200px;
|
|
||||||
background-color: #f1f1f1;
|
|
||||||
}
|
|
||||||
|
|
||||||
li a {
|
|
||||||
display: block;
|
|
||||||
color: #000;
|
|
||||||
padding: 8px 16px;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Change the link color on hover */
|
|
||||||
li a:hover {
|
|
||||||
background-color: #555;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes swing {
|
|
||||||
0% {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
10% {
|
|
||||||
transform: rotate(10deg);
|
|
||||||
}
|
|
||||||
30% {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
40% {
|
|
||||||
transform: rotate(-10deg);
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
60% {
|
|
||||||
transform: rotate(5deg);
|
|
||||||
}
|
|
||||||
70% {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
80% {
|
|
||||||
transform: rotate(-5deg);
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes sonar {
|
|
||||||
0% {
|
|
||||||
transform: scale(0.9);
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: scale(2);
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
font-size: 0.9rem;
|
|
||||||
}
|
|
||||||
.page-wrapper .sidebar-wrapper,
|
|
||||||
.sidebar-wrapper .sidebar-brand > a,
|
|
||||||
.sidebar-wrapper .sidebar-dropdown > a:after,
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a:before,
|
|
||||||
.sidebar-wrapper ul li a i,
|
|
||||||
.page-wrapper .page-content,
|
|
||||||
.sidebar-wrapper .sidebar-search input.search-menu,
|
|
||||||
.sidebar-wrapper .sidebar-search .input-group-text,
|
|
||||||
.sidebar-wrapper .sidebar-menu ul li a,
|
|
||||||
#show-sidebar,
|
|
||||||
#close-sidebar {
|
|
||||||
-webkit-transition: all 0.3s ease;
|
|
||||||
-moz-transition: all 0.3s ease;
|
|
||||||
-ms-transition: all 0.3s ease;
|
|
||||||
-o-transition: all 0.3s ease;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*----------------page-wrapper----------------*/
|
|
||||||
|
|
||||||
.page-wrapper {
|
|
||||||
height: 100vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-wrapper .theme {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
display: inline-block;
|
|
||||||
border-radius: 4px;
|
|
||||||
margin: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-wrapper .theme.chiller-theme {
|
|
||||||
background: #1e2229;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*----------------toggeled sidebar----------------*/
|
|
||||||
|
|
||||||
.page-wrapper.toggled .sidebar-wrapper {
|
|
||||||
left: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (min-width: 768px) {
|
|
||||||
.page-wrapper.toggled .page-content {
|
|
||||||
padding-left: 300px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/*----------------show sidebar button----------------*/
|
|
||||||
#show-sidebar {
|
|
||||||
position: fixed;
|
|
||||||
left: 0;
|
|
||||||
top: 10px;
|
|
||||||
border-radius: 0 4px 4px 0px;
|
|
||||||
width: 35px;
|
|
||||||
transition-delay: 0.3s;
|
|
||||||
}
|
|
||||||
.page-wrapper.toggled #show-sidebar {
|
|
||||||
left: -40px;
|
|
||||||
}
|
|
||||||
/*----------------sidebar-wrapper----------------*/
|
|
||||||
|
|
||||||
.sidebar-wrapper {
|
|
||||||
width: 260px;
|
|
||||||
height: 100%;
|
|
||||||
max-height: 100%;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: -300px;
|
|
||||||
z-index: 999;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper ul {
|
|
||||||
list-style-type: none;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper a {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*----------------sidebar-content----------------*/
|
|
||||||
|
|
||||||
.sidebar-content {
|
|
||||||
max-height: calc(100% - 30px);
|
|
||||||
height: calc(100% - 30px);
|
|
||||||
overflow-y: auto;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-content.desktop {
|
|
||||||
overflow-y: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------sidebar-brand----------------------*/
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-brand {
|
|
||||||
padding: 10px 20px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-brand > a {
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-weight: bold;
|
|
||||||
flex-grow: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-brand #close-sidebar {
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
/*--------------------sidebar-header----------------------*/
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-header {
|
|
||||||
padding: 20px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-header .user-pic {
|
|
||||||
float: left;
|
|
||||||
width: 60px;
|
|
||||||
padding: 2px;
|
|
||||||
border-radius: 12px;
|
|
||||||
margin-right: 15px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-header .user-pic img {
|
|
||||||
object-fit: cover;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-header .user-info {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-header .user-info > span {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-header .user-info .user-role {
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-header .user-info .user-status {
|
|
||||||
font-size: 11px;
|
|
||||||
margin-top: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-header .user-info .user-status i {
|
|
||||||
font-size: 8px;
|
|
||||||
margin-right: 4px;
|
|
||||||
color: #5cb85c;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-----------------------sidebar-search------------------------*/
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-search > div {
|
|
||||||
padding: 10px 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*----------------------sidebar-menu-------------------------*/
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu {
|
|
||||||
padding-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu .header-menu span {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 14px;
|
|
||||||
padding: 15px 20px 5px 20px;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu ul li a {
|
|
||||||
display: inline-block;
|
|
||||||
width: 100%;
|
|
||||||
text-decoration: none;
|
|
||||||
position: relative;
|
|
||||||
padding: 8px 30px 8px 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu ul li a i {
|
|
||||||
margin-right: 10px;
|
|
||||||
font-size: 12px;
|
|
||||||
width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
line-height: 30px;
|
|
||||||
text-align: center;
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu ul li a:hover > i::before {
|
|
||||||
display: inline-block;
|
|
||||||
animation: swing ease-in-out 0.5s 1 alternate;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-dropdown > a:after {
|
|
||||||
font-family: "Font Awesome 5 Free";
|
|
||||||
font-weight: 900;
|
|
||||||
content: "\f105";
|
|
||||||
font-style: normal;
|
|
||||||
display: inline-block;
|
|
||||||
font-style: normal;
|
|
||||||
font-variant: normal;
|
|
||||||
text-rendering: auto;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
text-align: center;
|
|
||||||
background: 0 0;
|
|
||||||
position: absolute;
|
|
||||||
right: 15px;
|
|
||||||
top: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu ul {
|
|
||||||
padding: 5px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li {
|
|
||||||
padding-left: 25px;
|
|
||||||
font-size: 13px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a:before {
|
|
||||||
content: "\f111";
|
|
||||||
font-family: "Font Awesome 5 Free";
|
|
||||||
font-weight: 400;
|
|
||||||
font-style: normal;
|
|
||||||
display: inline-block;
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
margin-right: 10px;
|
|
||||||
font-size: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu ul li a span.label,
|
|
||||||
.sidebar-wrapper .sidebar-menu ul li a span.badge {
|
|
||||||
float: right;
|
|
||||||
margin-top: 8px;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a .badge,
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a .label {
|
|
||||||
float: right;
|
|
||||||
margin-top: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-submenu {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-wrapper .sidebar-menu .sidebar-dropdown.active > a:after {
|
|
||||||
transform: rotate(90deg);
|
|
||||||
right: 17px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------side-footer------------------------------*/
|
|
||||||
|
|
||||||
.sidebar-footer {
|
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
|
||||||
bottom: 0;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-footer > a {
|
|
||||||
flex-grow: 1;
|
|
||||||
text-align: center;
|
|
||||||
height: 30px;
|
|
||||||
line-height: 30px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-footer > a .notification {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.badge-sonar {
|
|
||||||
display: inline-block;
|
|
||||||
background: #980303;
|
|
||||||
border-radius: 50%;
|
|
||||||
height: 8px;
|
|
||||||
width: 8px;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.badge-sonar:after {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
border: 2px solid #980303;
|
|
||||||
opacity: 0;
|
|
||||||
border-radius: 50%;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
animation: sonar 1.5s infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------page-content-----------------------------*/
|
|
||||||
|
|
||||||
.page-wrapper .page-content {
|
|
||||||
display: inline-block;
|
|
||||||
width: 100%;
|
|
||||||
padding-left: 0px;
|
|
||||||
padding-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-wrapper .page-content > div {
|
|
||||||
padding: 20px 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-wrapper .page-content {
|
|
||||||
overflow-x: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*------scroll bar---------------------*/
|
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
width: 5px;
|
|
||||||
height: 7px;
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar-button {
|
|
||||||
width: 0px;
|
|
||||||
height: 0px;
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar-thumb {
|
|
||||||
background: #525965;
|
|
||||||
border: 0px none #ffffff;
|
|
||||||
border-radius: 0px;
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar-thumb:hover {
|
|
||||||
background: #525965;
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar-thumb:active {
|
|
||||||
background: #525965;
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar-track {
|
|
||||||
background: transparent;
|
|
||||||
border: 0px none #ffffff;
|
|
||||||
border-radius: 50px;
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar-track:hover {
|
|
||||||
background: transparent;
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar-track:active {
|
|
||||||
background: transparent;
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar-corner {
|
|
||||||
background: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-----------------------------chiller-theme-------------------------------------------------*/
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-wrapper {
|
|
||||||
background: #31353d;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-header,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-search,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-menu {
|
|
||||||
border-top: 1px solid #3a3f48;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text {
|
|
||||||
border-color: transparent;
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-header .user-info .user-role,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-header .user-info .user-status,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-brand > a,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-menu ul li a,
|
|
||||||
.chiller-theme .sidebar-footer > a {
|
|
||||||
color: #818896;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-menu ul li:hover > a,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown.active > a,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-header .user-info,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-brand > a:hover,
|
|
||||||
.chiller-theme .sidebar-footer > a:hover i {
|
|
||||||
color: #b8bfce;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-wrapper.chiller-theme.toggled #close-sidebar {
|
|
||||||
color: #bdbdbd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.page-wrapper.chiller-theme.toggled #close-sidebar:hover {
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-wrapper ul li:hover a i,
|
|
||||||
.chiller-theme
|
|
||||||
.sidebar-wrapper
|
|
||||||
.sidebar-dropdown
|
|
||||||
.sidebar-submenu
|
|
||||||
li
|
|
||||||
a:hover:before,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu:focus + span,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown.active a i {
|
|
||||||
color: #16c7ff;
|
|
||||||
text-shadow: 0px 0px 10px rgba(22, 199, 255, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-menu ul li a i,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-search .input-group-text {
|
|
||||||
background: #3a3f48;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-wrapper .sidebar-menu .header-menu span {
|
|
||||||
color: #6c7b88;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-footer {
|
|
||||||
background: #3a3f48;
|
|
||||||
box-shadow: 0px -1px 5px #282c33;
|
|
||||||
border-top: 1px solid #464a52;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-footer > a:first-child {
|
|
||||||
border-left: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chiller-theme .sidebar-footer > a:last-child {
|
|
||||||
border-right: none;
|
|
||||||
}
|
|
@ -1,12 +0,0 @@
|
|||||||
.top {
|
|
||||||
width: 100vw;
|
|
||||||
background: #2e323f;
|
|
||||||
}
|
|
||||||
.top input {
|
|
||||||
border: 3px solid #aaa;
|
|
||||||
border-radius: 10px;
|
|
||||||
padding: 3px;
|
|
||||||
font-size: 16px;
|
|
||||||
background: #2e323f;
|
|
||||||
color: #aaa;
|
|
||||||
}
|
|
@ -1,47 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import "./style.css";
|
|
||||||
import Menu from "../menu";
|
|
||||||
//import find from '../serverses/find';
|
|
||||||
import Scxard from "../Cards/smallCard";
|
|
||||||
import Scard from "../Cards/smallCard";
|
|
||||||
export default class TopPanel extends React.Component {
|
|
||||||
find_pkg(pkg) {
|
|
||||||
let response = fetch("/find/?q" + pkg);
|
|
||||||
|
|
||||||
if (response.ok) {
|
|
||||||
// если HTTP-статус в диапазоне 200-299
|
|
||||||
// получаем тело ответа (см. про этот метод ниже)
|
|
||||||
|
|
||||||
return <Scard rec={response.json} />;
|
|
||||||
//json = response.json();
|
|
||||||
} else {
|
|
||||||
alert("Ошибка HTTP: " + response.status);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<header className="top">
|
|
||||||
<Menu menuItem={this.props.menuItem} />
|
|
||||||
|
|
||||||
<input
|
|
||||||
id="inS"
|
|
||||||
name="inS"
|
|
||||||
classname="form-control"
|
|
||||||
type="text"
|
|
||||||
placeholder="Введите имя пакета"
|
|
||||||
onChange={(e) => e.target.value}
|
|
||||||
style={{
|
|
||||||
fontSize: "1.2em",
|
|
||||||
margin: "10px",
|
|
||||||
//ackground: "#2e233f",
|
|
||||||
borderRadius: "15px",
|
|
||||||
border: "3px inset #2e322f",
|
|
||||||
color: "#CCC"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</header>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,33 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import { render } from "react-dom";
|
|
||||||
|
|
||||||
export default class Widget extends React.Component {
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
//background: "#1d1d1d",
|
|
||||||
//paddingRight: "0px",
|
|
||||||
//width: "100%",
|
|
||||||
marginTop: "35px",
|
|
||||||
overflow: "clip",
|
|
||||||
display: "inline",
|
|
||||||
|
|
||||||
//background: "rgb(59,58,125)",
|
|
||||||
//background:
|
|
||||||
// "linear-gradient(4deg, rgba(59,58,125,0.9671218829328606) 12%, rgba(148,187,233,1) 86%)",
|
|
||||||
|
|
||||||
float: "left",
|
|
||||||
//border: "1px solid #CCC",
|
|
||||||
//borderRadius: "6px",
|
|
||||||
//boxShadow: "3px 4px 10px #999"
|
|
||||||
borderBottom: "1px solid #CCC"
|
|
||||||
//transformStyle: "preserve-3d",
|
|
||||||
//transform: "rotate(30deg)"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{this.props.children}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,67 +0,0 @@
|
|||||||
import * as React from "react";
|
|
||||||
import { styled } from "@mui/material/styles";
|
|
||||||
import ArrowForwardIosSharpIcon from "@mui/icons-material/ArrowForwardIosSharp";
|
|
||||||
import MuiAccordion from "@mui/material/Accordion";
|
|
||||||
import MuiAccordionSummary from "@mui/material/AccordionSummary";
|
|
||||||
import MuiAccordionDetails from "@mui/material/AccordionDetails";
|
|
||||||
import Typography from "@mui/material/Typography";
|
|
||||||
|
|
||||||
const Accordion = styled((props) => (
|
|
||||||
<MuiAccordion disableGutters elevation={0} square {...props} />
|
|
||||||
))(({ theme }) => ({
|
|
||||||
border: `1px solid ${theme.palette.divider}`,
|
|
||||||
"&:not(:last-child)": {
|
|
||||||
borderBottom: 0
|
|
||||||
},
|
|
||||||
"&:before": {
|
|
||||||
display: "none"
|
|
||||||
}
|
|
||||||
}));
|
|
||||||
|
|
||||||
const AccordionSummary = styled((props) => (
|
|
||||||
<MuiAccordionSummary
|
|
||||||
expandIcon={<ArrowForwardIosSharpIcon sx={{ fontSize: "0.9rem" }} />}
|
|
||||||
{...props}
|
|
||||||
/>
|
|
||||||
))(({ theme }) => ({
|
|
||||||
backgroundColor:
|
|
||||||
theme.palette.mode === "dark"
|
|
||||||
? "rgba(255, 255, 255, .05)"
|
|
||||||
: "rgba(0, 0, 0, .03)",
|
|
||||||
flexDirection: "row-reverse",
|
|
||||||
"& .MuiAccordionSummary-expandIconWrapper.Mui-expanded": {
|
|
||||||
transform: "rotate(90deg)"
|
|
||||||
},
|
|
||||||
"& .MuiAccordionSummary-content": {
|
|
||||||
marginLeft: theme.spacing(1)
|
|
||||||
}
|
|
||||||
}));
|
|
||||||
|
|
||||||
const AccordionDetails = styled(MuiAccordionDetails)(({ theme }) => ({
|
|
||||||
padding: theme.spacing(2),
|
|
||||||
borderTop: "1px solid rgba(0, 0, 0, .125)"
|
|
||||||
}));
|
|
||||||
|
|
||||||
export default function CustomizedAccordions() {
|
|
||||||
const [expanded, setExpanded] = React.useState("panel1");
|
|
||||||
|
|
||||||
const handleChange = (panel) => (event, newExpanded) => {
|
|
||||||
setExpanded(newExpanded ? panel : false);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<Accordion
|
|
||||||
expanded={expanded === this.props.article.title}
|
|
||||||
onChange={handleChange(this.props.article.title)}
|
|
||||||
>
|
|
||||||
<AccordionSummary aria-controls="panel1d-content" id="panel1d-header">
|
|
||||||
<Typography>{this.props.article.title}</Typography>
|
|
||||||
</AccordionSummary>
|
|
||||||
<AccordionDetails>
|
|
||||||
<Typography>{this.props.article.text}</Typography>
|
|
||||||
</AccordionDetails>
|
|
||||||
</Accordion>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
@ -1,16 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import "./style.css";
|
|
||||||
export default class Button extends React.Component {
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
class
|
|
||||||
Name="btn"
|
|
||||||
onClick={() => this.props.handler()}
|
|
||||||
styl={{ background: "orange", color: "#FFF", textDecoration: "none" }}
|
|
||||||
>
|
|
||||||
{this.props.text}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,30 +0,0 @@
|
|||||||
import React from 'react'
|
|
||||||
import { render } from 'react-dom'
|
|
||||||
|
|
||||||
export default class Layers extends React.Component{
|
|
||||||
render(){
|
|
||||||
consttuctor(props){
|
|
||||||
super(props)
|
|
||||||
active = this.menuBtn[0]
|
|
||||||
|
|
||||||
}
|
|
||||||
return(
|
|
||||||
this.props.menuButton.map((it, p) => (
|
|
||||||
<div
|
|
||||||
id={it.text}
|
|
||||||
style={this.menuBtn.all}
|
|
||||||
onClick={() => (
|
|
||||||
(this.active = this.props.text),
|
|
||||||
this.chechActive(it.text),
|
|
||||||
console.log(this.active),
|
|
||||||
ReactDOM.render(
|
|
||||||
this.menuButton[p].handler(),
|
|
||||||
document.getElementById("listOve")
|
|
||||||
)
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{it.text}
|
|
||||||
</div>
|
|
||||||
))
|
|
||||||
|
|
||||||
)}}
|
|
@ -1,51 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import { Link } from "react-router-dom";
|
|
||||||
import { MenuItem, SubMenu } from "react-pro-sidebar";
|
|
||||||
import "react-pro-sidebar/dist/css/styles.css";
|
|
||||||
class MenuPage extends React.Component {
|
|
||||||
styles = { menu: { display: "inline-flex", li: { marginLeft: "20px" } } };
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<ul style={this.styles.menu}>
|
|
||||||
{this.props.menuItem.map((item) => (
|
|
||||||
<li style={{ padding: "10px", listStyle: "none" }}>
|
|
||||||
<b>
|
|
||||||
<Link
|
|
||||||
key={item.name}
|
|
||||||
className=""
|
|
||||||
id={item.name}
|
|
||||||
to={item.url}
|
|
||||||
style={{ color: "#CCC", textDecoration: "none" }}
|
|
||||||
>
|
|
||||||
{item.text}
|
|
||||||
</Link>
|
|
||||||
</b>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default MenuPage;
|
|
||||||
/*
|
|
||||||
|
|
||||||
<MenuItem style={this.styles.menu}>
|
|
||||||
<SubMenu title={this.props.title}>
|
|
||||||
{this.props.menuItem.map((item) => (
|
|
||||||
<MenuItem>
|
|
||||||
<Link
|
|
||||||
key={item.name}
|
|
||||||
className=""
|
|
||||||
id={item.name}
|
|
||||||
to={item.url}
|
|
||||||
style={{ color: "#CCC", textDecoration: "none" }}
|
|
||||||
>
|
|
||||||
{item.text}
|
|
||||||
</Link>
|
|
||||||
</MenuItem>
|
|
||||||
))}
|
|
||||||
</SubMenu>
|
|
||||||
</MenuItem>
|
|
||||||
|
|
||||||
|
|
||||||
*/
|
|
@ -1,96 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import ReactDOM from "react-dom";
|
|
||||||
import OverlayCard from "../Componets/Cards/OverlayCard";
|
|
||||||
export default class OvItem extends React.Component {
|
|
||||||
ViewOvelay(ov) {
|
|
||||||
//document.getElementById("container").style.display = "none";
|
|
||||||
//document.getElementById("backBtn").style.display = "block";
|
|
||||||
document.getElementById("containerInfo").style.display = "block";
|
|
||||||
ReactDOM.render(
|
|
||||||
<OverlayCard OverlayInfo={ov} title={this.props.title} />,
|
|
||||||
document.getElementById("containerInfo")
|
|
||||||
);
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
align="center"
|
|
||||||
className="flex_tab "
|
|
||||||
key={this.props.over.nane}
|
|
||||||
style={{
|
|
||||||
padding: "10px",
|
|
||||||
//margin: "3px",
|
|
||||||
marginTop: "5px",
|
|
||||||
//width: "100vw",
|
|
||||||
display: "inline-flex",
|
|
||||||
border: "1px solid #CCC",
|
|
||||||
borderRadius: " 10px",
|
|
||||||
boxShadow: "3px 4px 10px #CDC",
|
|
||||||
height: "125px"
|
|
||||||
//height:"75px"
|
|
||||||
//padding: "15px",
|
|
||||||
//display: "inline-flex",
|
|
||||||
//border: "1px solid #CCC"
|
|
||||||
//boxShadow: "3px 4px 10px #CDC"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
// border: "1px solid #AAA",
|
|
||||||
//boxShadow: "3px 4px 10px #CDC",
|
|
||||||
borderRadius: "10px",
|
|
||||||
width: "100vw"
|
|
||||||
//padding: "5px"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<h3 style={{ textAlign: "center" }}>
|
|
||||||
<b>{this.props.over.name}</b>{" "}
|
|
||||||
</h3>
|
|
||||||
<div
|
|
||||||
style={{ height: "32px", textAlign: "left", overflow: "hidden" }}
|
|
||||||
>
|
|
||||||
<span>{this.props.title.discription}:</span>
|
|
||||||
<b>
|
|
||||||
<span style={{ overflow: "hidden" }}>
|
|
||||||
{this.props.over.description}{" "}
|
|
||||||
</span>
|
|
||||||
</b>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
className=" btn-group"
|
|
||||||
style={{
|
|
||||||
//display: "flex",
|
|
||||||
//margin: "10px",
|
|
||||||
//padding: "0px",
|
|
||||||
float: "right",
|
|
||||||
color: "#000"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<div></div>
|
|
||||||
<div
|
|
||||||
className="btn"
|
|
||||||
style={{
|
|
||||||
background: "orange",
|
|
||||||
color: "#FFF",
|
|
||||||
textDecoration: "none",
|
|
||||||
cursor: "pointer"
|
|
||||||
}}
|
|
||||||
onClick={() => (
|
|
||||||
(document.getElementById(
|
|
||||||
"pTitle"
|
|
||||||
).textContent = this.props.over.name),
|
|
||||||
this.ViewOvelay(this.props.over)
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
{this.props.title.homepage}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="btn" style={{ cursor: "pointer" }}>
|
|
||||||
Добавить
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,103 +0,0 @@
|
|||||||
.btn-group div {
|
|
||||||
/*background-color: #04aa6d; /* Green background */
|
|
||||||
/*border: 1px solid green; /* Green border */
|
|
||||||
color: white; /* White text */
|
|
||||||
padding: 10px 24px; /* Some padding */
|
|
||||||
cursor: pointer; /* Pointer/hand icon */
|
|
||||||
float: left; /* Float the buttons side by side */
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-group div:not(:last-child) {
|
|
||||||
border-right: none; /* Prevent double borders */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Clear floats (clearfix hack) */
|
|
||||||
.btn-group:after {
|
|
||||||
content: "";
|
|
||||||
clear: both;
|
|
||||||
display: table;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Add a background color on hover */
|
|
||||||
.btn-group div:hover {
|
|
||||||
/* background-color: #3e8e41;*/
|
|
||||||
}
|
|
||||||
.btn:hover {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-toggle {
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
/* --width_window определён в /src/style.css*/
|
|
||||||
width: calc(var(--width_window) - 300px);
|
|
||||||
width: 350px;
|
|
||||||
/*padding: 0px;*/
|
|
||||||
}
|
|
||||||
|
|
||||||
/* *{}*/
|
|
||||||
.d6 {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.d6 form {
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
width: 300px;
|
|
||||||
margin: 0 auto;
|
|
||||||
/* height: 42px;*/
|
|
||||||
}
|
|
||||||
.d6 input {
|
|
||||||
height: 27px;
|
|
||||||
width: 0;
|
|
||||||
padding: 0 42px 0 0px;
|
|
||||||
border: none;
|
|
||||||
/*border-bottom: 2px solid transparent;*/
|
|
||||||
outline: none;
|
|
||||||
background: transparent;
|
|
||||||
transition: 0.4s cubic-bezier(0, 0.8, 0, 1);
|
|
||||||
font-size: 1.4em;
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
z-index: 2;
|
|
||||||
}
|
|
||||||
.d6 input:focus {
|
|
||||||
background: transparent;
|
|
||||||
width: 300px;
|
|
||||||
z-index: 1;
|
|
||||||
border-bottom: 2px solid #f9f0da;
|
|
||||||
}
|
|
||||||
.d6 .button {
|
|
||||||
/* background: #683b4d;*/
|
|
||||||
border: none;
|
|
||||||
height: 42px;
|
|
||||||
width: 42px;
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
.d6 .button * {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.d6 .button:before {
|
|
||||||
/*content: "\f002";*/
|
|
||||||
font-family: FontAwesome;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #f9f0da;
|
|
||||||
}
|
|
||||||
|
|
||||||
.Accrordion {
|
|
||||||
padding: 3px;
|
|
||||||
/*background: rgb(255, 255, 255);
|
|
||||||
*/
|
|
||||||
/*background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(229,237,235,0.9093838218881303) 35%);
|
|
||||||
|
|
||||||
*/
|
|
||||||
}
|
|
||||||
|
|
||||||
.search {
|
|
||||||
color: #fff;
|
|
||||||
background: no-repeat 50% 50%
|
|
||||||
url(https://yastatic.net/s3/home-static/_/h/H/Z5a86M6CqJTSA1DUeUxedyyKc.svg);
|
|
||||||
}
|
|
@ -1,5 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
|
|
||||||
const PackageContext = React.createContext();
|
|
||||||
|
|
||||||
export default PackageContext;
|
|
@ -1,52 +0,0 @@
|
|||||||
// In production, we register a service worker to serve assets from local cache.
|
|
||||||
|
|
||||||
// This lets the app load faster on subsequent visits in production, and gives
|
|
||||||
// it offline capabilities. However, it also means that developers (and users)
|
|
||||||
// will only see deployed updates on the "N+1" visit to a page, since previously
|
|
||||||
// cached resources are updated in the background.
|
|
||||||
|
|
||||||
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
|
|
||||||
// This link also includes instructions on opting out of this behavior.
|
|
||||||
|
|
||||||
export default function register() {
|
|
||||||
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
|
|
||||||
window.addEventListener('load', () => {
|
|
||||||
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
|
|
||||||
navigator.serviceWorker
|
|
||||||
.register(swUrl)
|
|
||||||
.then(registration => {
|
|
||||||
// eslint-disable-next-line no-param-reassign
|
|
||||||
registration.onupdatefound = () => {
|
|
||||||
const installingWorker = registration.installing;
|
|
||||||
installingWorker.onstatechange = () => {
|
|
||||||
if (installingWorker.state === 'installed') {
|
|
||||||
if (navigator.serviceWorker.controller) {
|
|
||||||
// At this point, the old content will have been purged and
|
|
||||||
// the fresh content will have been added to the cache.
|
|
||||||
// It's the perfect time to display a "New content is
|
|
||||||
// available; please refresh." message in your web app.
|
|
||||||
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
|
|
||||||
} else {
|
|
||||||
// At this point, everything has been precached.
|
|
||||||
// It's the perfect time to display a
|
|
||||||
// "Content is cached for offline use." message.
|
|
||||||
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
};
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
console.error('Error during service worker registration:', error);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export function unregister() {
|
|
||||||
if ('serviceWorker' in navigator) {
|
|
||||||
navigator.serviceWorker.ready.then(registration => {
|
|
||||||
registration.unregister();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,63 +0,0 @@
|
|||||||
{
|
|
||||||
"icons": {
|
|
||||||
"element-desktop-bin": "https://element.io/images/logo-mark-primary.svg",
|
|
||||||
"telegram-desktop-bin": "https://telegram.org/img/t_logo.png",
|
|
||||||
"zoom": "https://estudioflamenco.com/wp-content/uploads/2020/09/zoom-fondo-1.png",
|
|
||||||
"discord-bin": "https://www.pinclipart.com/picdir/middle/24-242816_flat-osx-icons-file-types-folders-apps-games.png",
|
|
||||||
"pidgin": "https://www.clipartmax.com/png/middle/302-3025613_pidgin-logo-pidgin-icon.png",
|
|
||||||
"teams": "https://www.kindpng.com/picc/m/363-3637910_microsoft-teams-download-hd-png-download.png",
|
|
||||||
"slack": "https://assets.stickpng.com/images/5cb480cd5f1b6d3fbadece79.png",
|
|
||||||
"audacity": "https://www.audacityteam.org/wp-content/themes/wp_audacity/img/logo.png",
|
|
||||||
"mixxx": "https://icons.iconarchive.com/icons/alecive/flatwoken/512/Apps-Mixxx-icon.png",
|
|
||||||
"lmms": "https://lmms.io/img/logo_lg.png",
|
|
||||||
"mpd": "https://www.musicpd.org/logo.png",
|
|
||||||
"rhythmbox": "https://iconape.com/wp-content/png_logo_vector/rhythmbox-logo-3-4-4.png",
|
|
||||||
"vlc": "https://images.videolan.org/images/goodies/thumbnails/cone_altglass_2.png",
|
|
||||||
"obs-studio": "https://obsproject.com/assets/images/new_icon_small-r.png",
|
|
||||||
"kdenlive": "https://kdenlive.org/wp-content/uploads/2016/06/kdenlive-logo-hori.png",
|
|
||||||
"mplayer": "https://p1.hiclipart.com/preview/740/970/419/reflections-mplayer-png-clipart.jpg",
|
|
||||||
"smplayer": "https://www.smplayer.info/images/free-media-player.png",
|
|
||||||
"nginx": "https://www.nginx.com/wp-content/uploads/2020/05/NGINX-product-icon.svg",
|
|
||||||
"apache": "https://www.apache.org/foundation/press/kit/feather_small.png",
|
|
||||||
|
|
||||||
"pycharm-community": "https://resources.jetbrains.com/storage/products/pycharm/img/meta/pycharm_logo_300x300.png",
|
|
||||||
"vim": "https://static-cdn.osdn.net/thumb/g/6/457/180x135_0.png",
|
|
||||||
"nano": "https://upload.wikimedia.org/wikipedia/commons/thumb/8/8a/Gnu-nano.svg/150px-Gnu-nano.svg.png",
|
|
||||||
"vscode": "https://code.visualstudio.com/apple-touch-icon.png",
|
|
||||||
"jedit": "https://upload.wikimedia.org/wikipedia/commons/d/db/JEdit_Logo.png",
|
|
||||||
"gedit": "https://gitlab.gnome.org/GNOME/gedit/raw/master/data/icons/org.gnome.gedit.svg",
|
|
||||||
|
|
||||||
"gimp": "https://www.gimp.org/images/frontpage/wilber-big.png",
|
|
||||||
"blender": "https://download.blender.org/branding/community/blender_community_badge_white.png",
|
|
||||||
"inkscape": "https://media.inkscape.org/static/images/inkscape-logo.svg",
|
|
||||||
"okular": "https://apps.kde.org/app-icons/org.kde.okular.svg",
|
|
||||||
"krita": "https://apps.kde.org/app-icons/org.kde.krita.svg",
|
|
||||||
|
|
||||||
"steam-launcher": "https://upload.wikimedia.org/wikipedia/commons/8/83/Steam_icon_logo.svg",
|
|
||||||
|
|
||||||
"wps-office": "https://ds.cache.wpscdn.com/wps-official-website/img/logo_normal.4e969ab.svg",
|
|
||||||
"libreoffice": "https://freesoft.ru/storage/images/196/1960/195979/195979_normal.png",
|
|
||||||
|
|
||||||
"firefox-bin": "https://www.mozilla.org/media/protocol/img/logos/firefox/logo.fedb52c912d6.svg",
|
|
||||||
"chromium": "https://www.chromium.org/_/rsrc/1438879449147/config/customLogo.gif",
|
|
||||||
"falkon": "https://www.falkon.org/images/favicon-196x196.png",
|
|
||||||
"links": "https://www.pinclipart.com/picdir/big/547-5473112_link-symbol-of-two-chains-links-linked-svg.png",
|
|
||||||
"vivaldi": "https://vivaldi.com/wp-content/themes/vivaldicom-theme/img/browsers/vivaldi.png",
|
|
||||||
"netsurf": "https://www.netsurf-browser.org/netsurf.png",
|
|
||||||
|
|
||||||
"nmap": "https://nmap.org/images/sitelogo.png",
|
|
||||||
"cpu-x": "https://github.com/X0rg/CPU-X/raw/master/data/icons/CPU-X_192x192.png",
|
|
||||||
"ncdu": "https://dev.yorhel.nl/img/ncdu.png",
|
|
||||||
|
|
||||||
"django": "https://static.djangoproject.com/img/icon-touch.e4872c4da341.png",
|
|
||||||
"flask": "https://flask.palletsprojects.com/en/2.0.x/_images/flask-logo.png",
|
|
||||||
"nodejs": "https://nodejs.org/static/images/logo.svg",
|
|
||||||
"tornado": "https://www.tornadoweb.org/en/stable/_images/tornado.png",
|
|
||||||
"erlang": "https://www.erlang.org/assets/img/erlang-logo.svg",
|
|
||||||
"rebar-bin": "https://rebar3.org/images/logo.svg",
|
|
||||||
"docker": "https://www.docker.com/sites/default/files/d8/Docker-R-Logo-08-2018-Monochomatic-RGB_Moby-x1.png",
|
|
||||||
|
|
||||||
"elixir": "",
|
|
||||||
"": ""
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,5 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import ReactDOM from "react-dom";
|
|
||||||
import App from "./example";
|
|
||||||
//https://www.youtube.com/watch?v=hf87iOdujLs
|
|
||||||
ReactDOM.render(<App />, document.getElementById("root"));
|
|
@ -1,13 +0,0 @@
|
|||||||
{
|
|
||||||
"recpvers": null,
|
|
||||||
"dependencies": {
|
|
||||||
"@emotion/react": "11.4.1",
|
|
||||||
"@emotion/styled": "11.3.0",
|
|
||||||
"react": "18.0.0-alpha-01be61c12",
|
|
||||||
"react-dom": "17.0.2",
|
|
||||||
"react-id-swiper": "4.0.0",
|
|
||||||
"react-id-swiper2": "1.0.7",
|
|
||||||
"react-pro-sidebar": "0.6.0",
|
|
||||||
"react-router-dom": "5.2.0"
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,25 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
|
|
||||||
//export default class PageCommunity extends React.Component {
|
|
||||||
class PageCommunity extends React.Component {
|
|
||||||
TitleView() {
|
|
||||||
try {
|
|
||||||
if (document.getElementById("pTitle").textContent !== "Сообщества") {
|
|
||||||
document.getElementById("pTitle").textContent = "Сообщества";
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
console.log(e);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
this.TitleView();
|
|
||||||
return (
|
|
||||||
<div style={{ padding: "30px" }}>
|
|
||||||
{this.TitleView()}
|
|
||||||
<div>Calculte Linux</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default PageCommunity;
|
|
@ -1,15 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
|
|
||||||
class InstallForm extends React.Component {
|
|
||||||
reqInst(param) {
|
|
||||||
console.log(param);
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div className="pane-group installForm">
|
|
||||||
<sCard rec={this.props.rec} />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default InstallForm;
|
|
@ -1,39 +0,0 @@
|
|||||||
// Changes XML to JSON
|
|
||||||
function xmlToJson(xml) {
|
|
||||||
// Create the return object
|
|
||||||
var obj = {};
|
|
||||||
|
|
||||||
if (xml.nodeType === 1) {
|
|
||||||
// element
|
|
||||||
// do attributes
|
|
||||||
if (xml.attributes.length > 0) {
|
|
||||||
obj["@attributes"] = {};
|
|
||||||
for (var j = 0; j < xml.attributes.length; j++) {
|
|
||||||
var attribute = xml.attributes.item(j);
|
|
||||||
obj["@attributes"][attribute.nodeName] = attribute.nodeValue;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} else if (xml.nodeType === 3) {
|
|
||||||
// text
|
|
||||||
obj = xml.nodeValue;
|
|
||||||
}
|
|
||||||
|
|
||||||
// do children
|
|
||||||
if (xml.hasChildNodes()) {
|
|
||||||
for (var i = 0; i < xml.childNodes.length; i++) {
|
|
||||||
var item = xml.childNodes.item(i);
|
|
||||||
var nodeName = item.nodeName;
|
|
||||||
if (typeof obj[nodeName] === "undefined") {
|
|
||||||
obj[nodeName] = xmlToJson(item);
|
|
||||||
} else {
|
|
||||||
if (typeof obj[nodeName].push === "undefined") {
|
|
||||||
var old = obj[nodeName];
|
|
||||||
obj[nodeName] = [];
|
|
||||||
obj[nodeName].push(old);
|
|
||||||
}
|
|
||||||
obj[nodeName].push(xmlToJson(item));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return obj;
|
|
||||||
}
|
|
@ -1,42 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import "./style.css";
|
|
||||||
class AuthForm extends React.Component {
|
|
||||||
isMobile() {
|
|
||||||
return navigator.userAgentData.mobile;
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div id="spAuth" className="spAuth ">
|
|
||||||
<div className={this.isMobile() ? "formAuth mobile" : "formAuth modal"}>
|
|
||||||
<h2>Авторизация</h2>
|
|
||||||
<div>
|
|
||||||
<p>
|
|
||||||
{" "}
|
|
||||||
Username: <input type="text" placeholder="demo" />
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
{" "}
|
|
||||||
Password:
|
|
||||||
<input type="password" placeholder="demo" />
|
|
||||||
</p>
|
|
||||||
`
|
|
||||||
<p>
|
|
||||||
{" "}
|
|
||||||
Server:
|
|
||||||
<input type="password" placeholder={window.location.href} />
|
|
||||||
</p>
|
|
||||||
<div
|
|
||||||
className="authBtn"
|
|
||||||
onClick={() =>
|
|
||||||
(document.getElementById("spAuth").style.display = "none")
|
|
||||||
}
|
|
||||||
>
|
|
||||||
Войти
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default AuthForm;
|
|
@ -1,71 +0,0 @@
|
|||||||
.modal {
|
|
||||||
padding: 50px;
|
|
||||||
background: #1d1d1d;
|
|
||||||
position: fixed;
|
|
||||||
top: 50%;
|
|
||||||
left: 50%;
|
|
||||||
-webkit-transform: translate(-50%, -50%);
|
|
||||||
-ms-transform: translate(-50%, -50%);
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
}
|
|
||||||
.mobile {
|
|
||||||
/*padding: 50px;*/
|
|
||||||
background: 1d1d1d;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100vh;
|
|
||||||
|
|
||||||
-webkit-transform: translate(-50%, -50%);
|
|
||||||
-ms-transform: translate(-50%, -50%);
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
}
|
|
||||||
.spAuth {
|
|
||||||
position: fixed;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100vh;
|
|
||||||
overflow: hidden;
|
|
||||||
background: #1d1d1d; /* #2e323f;*
|
|
||||||
/*background: url("https://on-desktop.com/ru/images/wp.php?path=/wps/20213D-graphics_Beautiful_purple_fractal_pattern_with_golden_lines_151099_.jpg&wp=2");
|
|
||||||
&*/
|
|
||||||
z-index: 9999;
|
|
||||||
|
|
||||||
font-size: 1.2em;
|
|
||||||
}
|
|
||||||
.formAuth {
|
|
||||||
/*position: fixed;
|
|
||||||
background: rgba(255, 255, 255, 0.85);*/
|
|
||||||
/*top: 40%;
|
|
||||||
left: 40%;*/
|
|
||||||
padding: 10px;
|
|
||||||
/*margin: -100px 0 0 -200px; /* отступы равны половинным размера формы */
|
|
||||||
/* чтобы форма была поверх всех элементов страницы */
|
|
||||||
background: #1d1d1d;
|
|
||||||
color: "#FFF";
|
|
||||||
/*position: fixed;*/
|
|
||||||
box-shadow: 0px 0px 100px #00f;
|
|
||||||
margin: 0 auto;
|
|
||||||
color: "#00F";
|
|
||||||
border: 1px solid #00f;
|
|
||||||
}
|
|
||||||
.formAuth h2 {
|
|
||||||
color: #00f;
|
|
||||||
}
|
|
||||||
.formAuth p {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
.formAuth input {
|
|
||||||
float: right;
|
|
||||||
border-radius: 5px;
|
|
||||||
font-size: 0.9em;
|
|
||||||
background: #1d1d1d;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
.authBtn {
|
|
||||||
float: right;
|
|
||||||
padding: 10px;
|
|
||||||
background: #00f;
|
|
||||||
color: #fff;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
@ -1,43 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
|
|
||||||
export default class PageCatalog extends React.Component {
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<div
|
|
||||||
className=" pane "
|
|
||||||
style={{
|
|
||||||
width: "100vw",
|
|
||||||
|
|
||||||
textAlign: "center"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{Object.keys(this.props.category).map((item, i) => (
|
|
||||||
<div>
|
|
||||||
<h2
|
|
||||||
style={{
|
|
||||||
background: "#2e323f",
|
|
||||||
color: "#AAA",
|
|
||||||
width: "100%"
|
|
||||||
}}
|
|
||||||
key={item}
|
|
||||||
id={item}
|
|
||||||
className=" "
|
|
||||||
onClick={() =>
|
|
||||||
this.props.ViewListPkgs(this.props.category[item])
|
|
||||||
}
|
|
||||||
>
|
|
||||||
{item}
|
|
||||||
</h2>
|
|
||||||
<div style={{ display: "grid" }}>
|
|
||||||
{this.props.category[item].map((p) => (
|
|
||||||
<span style={{ margin: "10px" }}>{p}</span>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,55 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
|
|
||||||
class PageDocs extends React.Component {
|
|
||||||
TitleView() {
|
|
||||||
try {
|
|
||||||
if (document.getElementById("pTitle").textContent !== "Документация") {
|
|
||||||
document.getElementById("pTitle").textContent = "Документация";
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
console.log(e);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
commands = [
|
|
||||||
"cd webport/source",
|
|
||||||
"npm install",
|
|
||||||
"npm run build",
|
|
||||||
"cd ..",
|
|
||||||
"sudo npm install --save-dev electron",
|
|
||||||
"npx electron .",
|
|
||||||
"cp -L sources/build ./",
|
|
||||||
"npm install --verbose electron"
|
|
||||||
];
|
|
||||||
|
|
||||||
render() {
|
|
||||||
this.TitleView();
|
|
||||||
return (
|
|
||||||
<div className="settings" style={{ padding: "10px" }}>
|
|
||||||
<h1>Сборка React</h1>
|
|
||||||
<code
|
|
||||||
style={{
|
|
||||||
border: "1px dotted #CCC",
|
|
||||||
padding: "10px"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
cd webport/source && npm install && npm run build
|
|
||||||
</code>
|
|
||||||
<h1>Сборка Electron bin</h1>
|
|
||||||
<code
|
|
||||||
style={{
|
|
||||||
border: "1px dotted #CCC",
|
|
||||||
padding: "10px"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{this.commands.map((cmd) => (
|
|
||||||
<span>
|
|
||||||
{cmd + "\t"} +{"&& "} +{"\t"}
|
|
||||||
</span>
|
|
||||||
))}
|
|
||||||
</code>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default PageDocs;
|
|
@ -1,13 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import sCard from "../Componets/Cards/smallCard";
|
|
||||||
class FindPkg extends React.Component {
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<sCard rec={this.props.paks} />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default FindPkg;
|
|
@ -1,36 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
|
|
||||||
class New extends React.Component {
|
|
||||||
TitleView() {
|
|
||||||
try {
|
|
||||||
if (document.getElementById("pTitle").textContent !== "Новости") {
|
|
||||||
document.getElementById("pTitle").textContent = "Новости";
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
console.log(e);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div style={{ padding: "10px" }}>
|
|
||||||
{this.TitleView()}
|
|
||||||
<ol>
|
|
||||||
{this.props.news.map((newItem, i) => (
|
|
||||||
<li
|
|
||||||
style={{
|
|
||||||
fontSize: "1.2em",
|
|
||||||
border: "1px dotted #CCC",
|
|
||||||
padding: "10px"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<b>{newItem.title}</b>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default New;
|
|
@ -1,24 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import { Link } from "react-router-dom";
|
|
||||||
//mport NavBar from "../Componets/NavList/navList";
|
|
||||||
import FullCard from "../Componets/Cards/fullCard";
|
|
||||||
|
|
||||||
class PkgList extends React.Component {
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<span>
|
|
||||||
<Link
|
|
||||||
className="btn"
|
|
||||||
style={{ float: "left", padding: "10px", textDecoration: "none" }}
|
|
||||||
to="/"
|
|
||||||
>
|
|
||||||
Назад
|
|
||||||
</Link>
|
|
||||||
</span>
|
|
||||||
<FullCard PackageName={this.props.PackageName} />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default PkgList;
|
|
@ -1,100 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import Accordion from "../Componets/Acardion";
|
|
||||||
//import Accordion from "../Componets/Acardion";
|
|
||||||
export default class UserProfilePage extends React.Component {
|
|
||||||
toBack() {
|
|
||||||
document.getElementById("conteinerInfo").style.display = "none";
|
|
||||||
}
|
|
||||||
ViewGroup(group) {
|
|
||||||
if (document.getElementById(group + "_group").style.display === "none") {
|
|
||||||
document.getElementById(group + "_group").style.display = " block";
|
|
||||||
} else {
|
|
||||||
document.getElementById(group + "_group").style.display = "none";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
checkPkg(nPkg) {
|
|
||||||
if (this.props.Ipkgs[nPkg.spit("/")[0]]) {
|
|
||||||
for (let n = 0; n < this.props.Ipkgs[nPkg.spit("/")[0]]; n++) {}
|
|
||||||
//return({name: this.props.Ipkgs[nPkg.spit('/')[0]], vers:""})
|
|
||||||
} else {
|
|
||||||
}
|
|
||||||
}
|
|
||||||
TitleView() {
|
|
||||||
try {
|
|
||||||
if (
|
|
||||||
document.getElementById("pTitle").textContent !== "Установленные пакеты"
|
|
||||||
) {
|
|
||||||
document.getElementById("pTitle").textContent = "Установленные пакеты";
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
console.log(e);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
render() {
|
|
||||||
//document.getElementById("HomePage").style.display = "block";
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
{this.TitleView()}
|
|
||||||
{console.log(this.props.Ipkgs)}
|
|
||||||
<span
|
|
||||||
className="btn"
|
|
||||||
id="backBtn"
|
|
||||||
style={{
|
|
||||||
padding: "0px 20px 0px 20px",
|
|
||||||
float: "left",
|
|
||||||
color: "#AAA",
|
|
||||||
background: "#FFF",
|
|
||||||
marginRight: "0.85em",
|
|
||||||
fontSize: "1.6em",
|
|
||||||
border: "1px outset #444"
|
|
||||||
//borderRadius: ".9em"
|
|
||||||
}}
|
|
||||||
onClick={() => this.toBack()}
|
|
||||||
>
|
|
||||||
<b> {"<"}</b>
|
|
||||||
</span>
|
|
||||||
<ul>
|
|
||||||
{Object.keys(this.props.Ipkgs).map((name) => (
|
|
||||||
<li
|
|
||||||
style={{
|
|
||||||
textAlign: "left",
|
|
||||||
borderBottom: "1px dotted #AAA",
|
|
||||||
listStyle: "none"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Accordion
|
|
||||||
title={name}
|
|
||||||
style={{ background: "#2e323f", color: "#FFF" }}
|
|
||||||
>
|
|
||||||
{this.props.Ipkgs[name].map((pkg) => (
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
width: "80vw",
|
|
||||||
padding: "10px",
|
|
||||||
fontSize: "1.2em",
|
|
||||||
borderBottom: "1px solid #CDC"
|
|
||||||
//background:"#AAA"
|
|
||||||
// #2e323f"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{pkg.name}
|
|
||||||
<div
|
|
||||||
className="btn"
|
|
||||||
style={{
|
|
||||||
float: "right",
|
|
||||||
padding: "5px",
|
|
||||||
cursor: "pointer"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Удалить
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</Accordion>
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,198 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import Accordion from "../Componets/Acardion";
|
|
||||||
import CheckField from "../Componets/CheckField";
|
|
||||||
|
|
||||||
//import Menu from "../Componets/menu";
|
|
||||||
/*const menuItm = [
|
|
||||||
{ name: "portage", text: "portage", url: "/sport" },
|
|
||||||
{ name: "webpp", text: "App", url: "/app" }
|
|
||||||
];*/
|
|
||||||
class PageSettings extends React.Component {
|
|
||||||
settings = {
|
|
||||||
USE: [],
|
|
||||||
lang: "RU"
|
|
||||||
};
|
|
||||||
styleUseinfo = {
|
|
||||||
mobile: {
|
|
||||||
position: "fixed",
|
|
||||||
bottom: "0px",
|
|
||||||
left: "0px",
|
|
||||||
width: "100vw",
|
|
||||||
background: "#FFF",
|
|
||||||
borderTop: "1px solid #CDC",
|
|
||||||
paddingTop: "5px"
|
|
||||||
},
|
|
||||||
nomob: { margin: "5px" }
|
|
||||||
};
|
|
||||||
themes = [
|
|
||||||
{ id: "0", name: "Светлая", path: "" },
|
|
||||||
{ id: "1", name: "Тёмная", path: "" }
|
|
||||||
];
|
|
||||||
langs = [
|
|
||||||
{ title: "RU", link: "" },
|
|
||||||
{ title: "EN", link: "" },
|
|
||||||
{ title: "DE", link: "" }
|
|
||||||
];
|
|
||||||
|
|
||||||
isMobile() {
|
|
||||||
try {
|
|
||||||
document.createEvent("TouchEvent");
|
|
||||||
return true;
|
|
||||||
} catch (e) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
changLang(lang) {
|
|
||||||
console.log(lang);
|
|
||||||
if (
|
|
||||||
document.getElementById(lang).style.background !== "#0F0" ||
|
|
||||||
document.getElementById(lang).style.background !== "rgb(0, 255, 0)"
|
|
||||||
) {
|
|
||||||
document.getElementById(lang).style.background = "#0F0";
|
|
||||||
|
|
||||||
document.getElementById(this.settings.lang).style.background = "#FFF";
|
|
||||||
this.settings.lang = lang;
|
|
||||||
//document.getElementById(lang).style.background = "#FFF";
|
|
||||||
|
|
||||||
//this.IntstallPackageParamms.USE.map((us, i)=>(
|
|
||||||
// if( us== use)this.IntstallPackageParamms.USE[i].delete
|
|
||||||
//))
|
|
||||||
} else {
|
|
||||||
document.getElementById(lang).style.background = "#0F0";
|
|
||||||
this.settings.lang = lang;
|
|
||||||
//this.settings.USE[this.IntstallPackageParamms.USE.length + 1] = use;
|
|
||||||
}
|
|
||||||
console.log(this.settings);
|
|
||||||
}
|
|
||||||
|
|
||||||
addUse(use) {
|
|
||||||
console.log(use);
|
|
||||||
if (
|
|
||||||
document.getElementById(use).style.background === "#0F0" ||
|
|
||||||
document.getElementById(use).style.background === "rgb(0, 255, 0)"
|
|
||||||
) {
|
|
||||||
document.getElementById(use).style.background = "#FFF";
|
|
||||||
//this.IntstallPackageParamms.USE.map((us, i)=>(
|
|
||||||
// if( us== use)this.IntstallPackageParamms.USE[i].delete
|
|
||||||
//))
|
|
||||||
} else {
|
|
||||||
document.getElementById(use).style.background = "#0F0";
|
|
||||||
//this.settings.USE[this.IntstallPackageParamms.USE.length + 1] = use;
|
|
||||||
}
|
|
||||||
console.log(this.settings);
|
|
||||||
}
|
|
||||||
VuseInfo(uId, use) {
|
|
||||||
//console.log(typeof(use));
|
|
||||||
console.log(uId);
|
|
||||||
//console.log(Object.keys(this.props.uses));
|
|
||||||
|
|
||||||
if (use in this.props.uses) {
|
|
||||||
document.getElementById("useInfo").textContent = use;
|
|
||||||
//document.getElementById(uId).style.background = "orange";
|
|
||||||
//alert(this.props.useDes[use]);
|
|
||||||
} else {
|
|
||||||
document.getElementById("useInfo").textContent = use;
|
|
||||||
}
|
|
||||||
//document.getElementById("useInfo").textContent = use;
|
|
||||||
}
|
|
||||||
TitleView() {
|
|
||||||
try {
|
|
||||||
if (document.getElementById("pTitle").textContent !== "Настройки") {
|
|
||||||
document.getElementById("pTitle").textContent = "Настройки";
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
console.log(e);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
this.TitleView();
|
|
||||||
return (
|
|
||||||
<div id="HomePage" className="settings">
|
|
||||||
<div>
|
|
||||||
<Accordion title="UI">
|
|
||||||
<hr />
|
|
||||||
<div>
|
|
||||||
<Accordion title={"Темы"}>
|
|
||||||
<ul
|
|
||||||
className="btn-group"
|
|
||||||
style={{ display: "inline-flex", listStyle: "none" }}
|
|
||||||
>
|
|
||||||
{this.themes.map((t) => (
|
|
||||||
<li id={t.id} style={{ marginLeft: "10px" }}>
|
|
||||||
{t.name}
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</Accordion>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<Accordion title={"Язык"}>
|
|
||||||
<ul
|
|
||||||
style={{ display: "inline-flex", listStyle: "none" }}
|
|
||||||
className="btn-group"
|
|
||||||
>
|
|
||||||
{Object.keys(this.langs).map((lng) => (
|
|
||||||
<li
|
|
||||||
id={this.langs[lng].title}
|
|
||||||
style={{ marginLeft: "10px" }}
|
|
||||||
onClick={() => this.changLang(this.langs[lng].title)}
|
|
||||||
>
|
|
||||||
{this.langs[lng].title}
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</Accordion>
|
|
||||||
</div>
|
|
||||||
</Accordion>
|
|
||||||
</div>
|
|
||||||
<Accordion title={"Приложение"}>
|
|
||||||
<Accordion title={"Сервер"}>
|
|
||||||
<p>
|
|
||||||
Адресс сервера <input type="text" placeholder="loaclhost:8000" />{" "}
|
|
||||||
</p>
|
|
||||||
</Accordion>
|
|
||||||
</Accordion>
|
|
||||||
<Accordion title={"Portage"}>
|
|
||||||
<hr />
|
|
||||||
<CheckField
|
|
||||||
text={"Искать в Сторонних оврелях"}
|
|
||||||
checking={true}
|
|
||||||
id={"searchOverlays"}
|
|
||||||
/>
|
|
||||||
<CheckField
|
|
||||||
text={"Устанавливать бинарные пакеты"}
|
|
||||||
checking={true}
|
|
||||||
id={"statrBinInstlPKg"}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<div className="sUse" style={{ paddingLeft: "20px" }}>
|
|
||||||
<Accordion title={"USE"} className="sUses">
|
|
||||||
{Object.keys(this.props.uses).map((u, j) => (
|
|
||||||
<span
|
|
||||||
key={u}
|
|
||||||
id={u}
|
|
||||||
onMouseOver={() => this.VuseInfo(u, this.props.uses[u])}
|
|
||||||
onClick={() => this.addUse(u)}
|
|
||||||
>
|
|
||||||
{u}
|
|
||||||
</span>
|
|
||||||
))}
|
|
||||||
<b>
|
|
||||||
<div
|
|
||||||
id="useInfo"
|
|
||||||
className="useInfo"
|
|
||||||
style={
|
|
||||||
this.isMobile ? this.styleUseinfo.mobile : this.style.nomob
|
|
||||||
}
|
|
||||||
></div>
|
|
||||||
</b>
|
|
||||||
</Accordion>
|
|
||||||
</div>
|
|
||||||
</Accordion>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
export default PageSettings;
|
|
@ -1,19 +0,0 @@
|
|||||||
const styles = {
|
|
||||||
splash: {
|
|
||||||
position: "fixed",
|
|
||||||
width: "100vw",
|
|
||||||
height: "100vh",
|
|
||||||
background: "#2e323f",
|
|
||||||
h1: {
|
|
||||||
color: "#AAA",
|
|
||||||
contentAlign: "center"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
function loadData() {
|
|
||||||
console.log("load");
|
|
||||||
}
|
|
||||||
function Splash() {
|
|
||||||
return <div style={styles.splash}>Загрузка</div>;
|
|
||||||
}
|
|
||||||
export default Splash;
|
|
File diff suppressed because one or more lines are too long
@ -1,2 +0,0 @@
|
|||||||
{
|
|
||||||
}
|
|
@ -1,5 +0,0 @@
|
|||||||
{
|
|
||||||
"template": "create-react-app",
|
|
||||||
"hardReloadOnChange": true,
|
|
||||||
"infiniteLoopProtection": true
|
|
||||||
}
|
|
Loading…
Reference in new issue