serkus01
2 years ago
parent
64b90c56a7
commit
65ff2ff12a
@ -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*
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,46 +0,0 @@
|
||||
const { app, BrowserWindow } = require('electron');
|
||||
const path = require('path');
|
||||
|
||||
// Handle creating/removing shortcuts on Windows when installing/uninstalling.
|
||||
if (require('electron-squirrel-startup')) { // eslint-disable-line global-require
|
||||
app.quit();
|
||||
}
|
||||
|
||||
const createWindow = () => {
|
||||
// Create the browser window.
|
||||
const mainWindow = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
});
|
||||
|
||||
// and load the index.html of the app.
|
||||
mainWindow.loadFile(path.join(__dirname, 'localhost:3000'));
|
||||
|
||||
// Open the DevTools.
|
||||
mainWindow.webContents.openDevTools();
|
||||
};
|
||||
|
||||
// This method will be called when Electron has finished
|
||||
// initialization and is ready to create browser windows.
|
||||
// Some APIs can only be used after this event occurs.
|
||||
app.on('ready', createWindow);
|
||||
|
||||
// Quit when all windows are closed, except on macOS. There, it's common
|
||||
// for applications and their menu bar to stay active until the user quits
|
||||
// explicitly with Cmd + Q.
|
||||
app.on('window-all-closed', () => {
|
||||
if (process.platform !== 'darwin') {
|
||||
app.quit();
|
||||
}
|
||||
});
|
||||
|
||||
app.on('activate', () => {
|
||||
// On OS X it's common to re-create a window in the app when the
|
||||
// dock icon is clicked and there are no other windows open.
|
||||
if (BrowserWindow.getAllWindows().length === 0) {
|
||||
createWindow();
|
||||
}
|
||||
});
|
||||
|
||||
// In this file you can include the rest of your app's specific main process
|
||||
// code. You can also put them in separate files and import them here.
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,60 +0,0 @@
|
||||
{
|
||||
"recpvers": null,
|
||||
"dependencies": {
|
||||
"@material-ui/core": "4.12.1",
|
||||
"electron-squirrel-startup": "^1.0.0",
|
||||
"material-ui": "0.20.2",
|
||||
"react": "18.0.0-alpha-01be61c12",
|
||||
"react-dom": "17.0.2",
|
||||
"react-pro-sidebar": "0.6.0",
|
||||
"react-router-dom": "5.2.0"
|
||||
},
|
||||
"name": "webport",
|
||||
"description": null,
|
||||
"version": "0.0.1372",
|
||||
"main": "main.js",
|
||||
"devDependencies": {
|
||||
"@electron-forge/cli": "^6.0.0-beta.61",
|
||||
"@electron-forge/maker-deb": "^6.0.0-beta.61",
|
||||
"@electron-forge/maker-rpm": "^6.0.0-beta.61",
|
||||
"@electron-forge/maker-squirrel": "^6.0.0-beta.61",
|
||||
"@electron-forge/maker-zip": "^6.0.0-beta.61",
|
||||
"electron": "^15.0.0",
|
||||
"react-scripts": "^4.0.3"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "electron-forge start",
|
||||
"build": "react-scripts build",
|
||||
"test": "react-scripts test --env=jsdom",
|
||||
"eject": "react-scripts eject",
|
||||
"package": "electron-forge package",
|
||||
"make": "electron-forge make"
|
||||
},
|
||||
"config": {
|
||||
"forge": {
|
||||
"packagerConfig": {},
|
||||
"makers": [
|
||||
{
|
||||
"name": "@electron-forge/maker-squirrel",
|
||||
"config": {
|
||||
"name": "webport"
|
||||
}
|
||||
},
|
||||
{
|
||||
"name": "@electron-forge/maker-zip",
|
||||
"platforms": [
|
||||
"darwin"
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "@electron-forge/maker-deb",
|
||||
"config": {}
|
||||
},
|
||||
{
|
||||
"name": "@electron-forge/maker-rpm",
|
||||
"config": {}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Before Width: | Height: | Size: 24 KiB |
@ -1,42 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<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>React App</title>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<head>
|
||||
<title>Webport</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,71 +0,0 @@
|
||||
import React, { useState } from "react";
|
||||
import NavBar from "./NavList/navList";
|
||||
|
||||
export default class AppConteiner 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 = "righ";
|
||||
document.getElementById("navBar").style.left = "0px";
|
||||
this.VVSB = true;
|
||||
} else {
|
||||
document.getElementById("MainContent").style.paddingLeft = "0px";
|
||||
document.getElementById("navBar").style.left = "-280px";
|
||||
this.VVSB = false;
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<NavBar
|
||||
category={this.props.category}
|
||||
menuItem={this.props.menuItems}
|
||||
/>
|
||||
<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={{
|
||||
position: "fixed",
|
||||
padding: "20px 40px",
|
||||
background: "#FFF",
|
||||
width: "100vw",
|
||||
top: "0px"
|
||||
}}
|
||||
>
|
||||
<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>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,99 +0,0 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
import MainPage from "..//../pages/main";
|
||||
import "./style.css";
|
||||
class FullCard extends React.Component {
|
||||
ui = {
|
||||
name: "Имя",
|
||||
category: "Категория:",
|
||||
versions: "Доступные версии",
|
||||
uses: " USE:",
|
||||
decription: "Описание:",
|
||||
site: "Сайт:",
|
||||
button: {
|
||||
text: "Установить"
|
||||
}
|
||||
};
|
||||
toBack() {
|
||||
ReactDOM.render(
|
||||
<MainPage icons={this.props.icons} rec={this.props.PropMain} />,
|
||||
document.getElementById("HomePage")
|
||||
);
|
||||
}
|
||||
checkVersion(item) {
|
||||
console.log(item.split("[U]")[1] === "");
|
||||
if (item.split("[U]")[1] === "") {
|
||||
return (
|
||||
<li
|
||||
key={item}
|
||||
id={item}
|
||||
style={{ background: "green", color: "#FFF", marginLeft: "5px" }}
|
||||
>
|
||||
{item.split("[U]")[0]}
|
||||
</li>
|
||||
);
|
||||
} else {
|
||||
return (
|
||||
<li
|
||||
key={item}
|
||||
id={item}
|
||||
style={{ background: "#F00", color: "#FFF", marginLeft: "5px" }}
|
||||
>
|
||||
{item.split("[M]")[0]}
|
||||
</li>
|
||||
);
|
||||
}
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div className="fullCard">
|
||||
<div style={{ padding: "20px" }} onClick={() => this.toBack()}>
|
||||
BaCk
|
||||
</div>
|
||||
|
||||
<div className=" sCard">
|
||||
<h1 className="title">{this.props.PackageName.Name.split("/")[1]}</h1>
|
||||
<hr />
|
||||
<img
|
||||
src={this.props.icons[this.props.PackageName.Name.split("/")[1]]}
|
||||
style={{ width: "128px", height: "128px" }}
|
||||
/>
|
||||
<div style={{}}>
|
||||
<span>
|
||||
{" "}
|
||||
<b>{this.ui.category}</b>{" "}
|
||||
{this.props.PackageName.Name.split("/")[0]}
|
||||
</span>
|
||||
<ul className="cVer">
|
||||
<b>{this.ui.versions}</b>
|
||||
{this.props.PackageName.version.map((v) => this.checkVersion(v))}
|
||||
</ul>
|
||||
<div className="sUse">
|
||||
<b>{this.ui.uses}</b>
|
||||
{this.props.PackageName.USE.map((u) => (
|
||||
<span key={u} id={u}>
|
||||
{u}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
<div> </div>
|
||||
|
||||
<p>
|
||||
<b>{this.ui.decription}</b> {this.props.PackageName.Description}
|
||||
</p>
|
||||
<a href={this.props.PackageName.Home_page}>{this.ui.site} </a>
|
||||
|
||||
<div className="Btm">
|
||||
<strong>
|
||||
<span className="btn right" id={this.props.PackageName.Name}>
|
||||
{this.ui.button.text}
|
||||
</span>
|
||||
</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default FullCard;
|
||||
@ -1,83 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
//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;
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
return this.props.rec.map((pksl, i) => (
|
||||
<div
|
||||
className="Card"
|
||||
style={{
|
||||
padding: "13px",
|
||||
border: "1px solid #AAA",
|
||||
//borderRadius: "16px",
|
||||
backgroundColor: "#f9f9fa",
|
||||
width: "20%"
|
||||
|
||||
//coloor: "#444"
|
||||
//background: "#2E323F",
|
||||
//color: "#AAA"
|
||||
}}
|
||||
onClick={() => this.props.ViewPackageInfo(this.props.rec[i])}
|
||||
>
|
||||
<img
|
||||
style={{
|
||||
position: "relative",
|
||||
float: "left",
|
||||
width: "48px",
|
||||
height: "48px"
|
||||
}}
|
||||
src="/"
|
||||
/>
|
||||
<div
|
||||
style={{
|
||||
//display: "flex",
|
||||
flex: "1",
|
||||
padding: " 0 6px",
|
||||
height: "100%",
|
||||
borderBottom: " 1px solid rgba(0, 0, 0, 0.05)",
|
||||
justifyContent: "space-between"
|
||||
|
||||
//color: "#AAA"
|
||||
}}
|
||||
>
|
||||
<b style={{ width: "100%", display: "block", textAlign: "center" }}>
|
||||
{pksl.Name.split("/")[1]}
|
||||
</b>
|
||||
{
|
||||
<div
|
||||
style={{ position: "relative", top: "36px", textAlign: "left" }}
|
||||
>
|
||||
<div className="descrition" style={{ display: "flex" }}>
|
||||
<b style={{ textAlign: "left", whiteSpace: "break-spaces" }}>
|
||||
{ui.description} {":"} {pksl.Description}
|
||||
</b>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
));
|
||||
}
|
||||
}
|
||||
export default Scard;
|
||||
@ -1,54 +0,0 @@
|
||||
.sCard {
|
||||
padding: 10px;
|
||||
font-size: 1.2em;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #aaa;
|
||||
}
|
||||
|
||||
.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-left: 5px;
|
||||
}
|
||||
.cVer {
|
||||
display: flex;
|
||||
}
|
||||
.cVer li {
|
||||
list-style: none;
|
||||
|
||||
padding-left: 5px;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
@ -1,12 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
export default class CheckField extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<p>
|
||||
<span> {this.props.text}</span>
|
||||
<input style={{ float: "right" }} type="checkbox" />
|
||||
</p>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,57 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
export default class MainConteiner 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 = "righ";
|
||||
document.getElementById("navBar").style.left = "0px";
|
||||
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,196 +0,0 @@
|
||||
import React, { Component } from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
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";
|
||||
//var view = false;
|
||||
class NavBar extends Component {
|
||||
ui = {
|
||||
menu: {
|
||||
text: "Меню"
|
||||
},
|
||||
catalog: {
|
||||
text: "Каталог"
|
||||
}
|
||||
};
|
||||
checkAlias(text) {
|
||||
//console.log( "aliases:\t" + this.props.aliases)
|
||||
return text;
|
||||
try {
|
||||
return this.props.aliases[text];
|
||||
//console.log.log(this.props.aliases[text]);
|
||||
} catch (e) {
|
||||
return text;
|
||||
//console.log(e);
|
||||
}
|
||||
}
|
||||
viewPakegeInfo(pkgName) {
|
||||
const url = "/find?pkg=" + "pkgNme";
|
||||
const response = fetch(url);
|
||||
|
||||
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")
|
||||
);
|
||||
} else {
|
||||
alert("Ошибка HTTP: " + response.status);
|
||||
}
|
||||
|
||||
console.log(pkgName);
|
||||
}
|
||||
findPakg(pkg) {
|
||||
this.viewPakegeInfo(pkg);
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<ProSidebar
|
||||
id="navBar"
|
||||
style={{
|
||||
background: "2e323f",
|
||||
position: "fixed",
|
||||
height: "100vh",
|
||||
left: "-280px"
|
||||
}}
|
||||
>
|
||||
<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"
|
||||
}}
|
||||
>
|
||||
<img
|
||||
style={{ width: "56px", height: "56px" }}
|
||||
className="img-responsive img-rounded"
|
||||
src="https://raw.githubusercontent.com/azouaoui-med/pro-sidebar-template/gh-pages/src/img/user.jpg"
|
||||
alt="User picture"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
className="user-info"
|
||||
style={{ float: "left", width: " 100%" }}
|
||||
>
|
||||
<span className="user-name">
|
||||
Jhon
|
||||
<strong>Smith</strong>
|
||||
</span>
|
||||
<span
|
||||
className="user-role"
|
||||
style={{ width: "100vw", color: "green" }}
|
||||
>
|
||||
Guest
|
||||
</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" }}
|
||||
>
|
||||
<SubMenu title={this.ui.catalog.text}>
|
||||
{Object.keys(this.props.category).map((k, i) => (
|
||||
<MenuItem
|
||||
style={{
|
||||
paddingRight: "0px",
|
||||
width: "100%"
|
||||
}}
|
||||
>
|
||||
<SubMenu title={this.checkAlias(k)}>
|
||||
{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>
|
||||
);
|
||||
}
|
||||
}
|
||||
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,31 +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: {}
|
||||
};
|
||||
render() {
|
||||
return (
|
||||
<MenuItem>
|
||||
<SubMenu title={this.props.title}>
|
||||
{this.props.menuItem.map((item) => (
|
||||
<MenuItem>
|
||||
<Link
|
||||
key={item.name}
|
||||
className=""
|
||||
id={item.name}
|
||||
to={item.url}
|
||||
style={{}}
|
||||
>
|
||||
{item.text}
|
||||
</Link>
|
||||
</MenuItem>
|
||||
))}
|
||||
</SubMenu>
|
||||
</MenuItem>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default MenuPage;
|
||||
@ -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,5 +0,0 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
import App from "./example";
|
||||
|
||||
ReactDOM.render(<App />, document.getElementById("root"));
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,7 +0,0 @@
|
||||
import React from "react;";
|
||||
|
||||
export default class PageCommunity extends React.Component {
|
||||
render() {
|
||||
return <div></div>;
|
||||
}
|
||||
}
|
||||
@ -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,24 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
class AuthForm extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<div className="formAuth'">
|
||||
<h2>Авторизация</h2>
|
||||
<p>
|
||||
{" "}
|
||||
Username: <input type="text" />
|
||||
</p>
|
||||
<p>
|
||||
{" "}
|
||||
Password:
|
||||
<input type="password" />
|
||||
</p>
|
||||
<div className="authBtn">Войти</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default AuthForm;
|
||||
@ -1,20 +0,0 @@
|
||||
.spAuth {
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
.formAuth {
|
||||
/*position: fixed;*/
|
||||
box-shadow: 3px 4px 10px #ccc;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.formAuth input {
|
||||
border-radius: 10px;
|
||||
}
|
||||
.authBtn {
|
||||
float: right;
|
||||
padding: 10px;
|
||||
background: #0f0;
|
||||
color: #fff;
|
||||
}
|
||||
@ -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,12 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
class PageDocs extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="settings">
|
||||
<h2>Documents</h2>
|
||||
</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,111 +0,0 @@
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom";
|
||||
import Scard from "../Componets/Cards/smallCard";
|
||||
import FullCard from "../Componets/Cards/fullCard";
|
||||
//import NavBar from "../Componets/NavList/navList";
|
||||
import "./style.css";
|
||||
|
||||
export default class MainPage extends React.Component {
|
||||
i = {
|
||||
name: "Имя",
|
||||
category: "Категория:",
|
||||
versions: " версии:Доступные",
|
||||
uses: " USE:",
|
||||
decription: "Описание:",
|
||||
site: "Сайт:",
|
||||
button: {
|
||||
text: "Установить"
|
||||
}
|
||||
};
|
||||
|
||||
VVSB = false;
|
||||
viewSideBar() {
|
||||
if (!this.VVSB) {
|
||||
document.getElementById("MainContent").style.paddingLeft = "300px";
|
||||
document.getElementById("btn-toggle").style.float = "righ";
|
||||
document.getElementById("navBar").style.left = "0px";
|
||||
this.VVSB = true;
|
||||
} else {
|
||||
document.getElementById("MainContent").style.paddingLeft = "0px";
|
||||
document.getElementById("navBar").style.left = "-280px";
|
||||
this.VVSB = false;
|
||||
}
|
||||
}
|
||||
viweinfo(pkg) {
|
||||
//onClick={() => this.props.ViewPackageInfo(this.props.rec[k][i])}
|
||||
ReactDOM.render(
|
||||
<FullCard
|
||||
PackageName={pkg}
|
||||
PropMain={this.props.rec}
|
||||
icons={this.props.icons}
|
||||
/>,
|
||||
document.getElementById("HomePage")
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div id="HomePage">
|
||||
{Object.keys(this.props.rec).map((k) => (
|
||||
<div
|
||||
style={{
|
||||
paddingRight: "0px",
|
||||
width: "100%",
|
||||
overflow: "clip"
|
||||
}}
|
||||
>
|
||||
<p>
|
||||
{" "}
|
||||
<b stye={{ fontSize: "1.3em" }}>{k.split("[")[1]}</b>
|
||||
</p>
|
||||
{this.props.rec[k].map((pn, i) => (
|
||||
<div
|
||||
style={{
|
||||
padding: "5px",
|
||||
//width: "100vw",
|
||||
borderBottom: "1px solid #CCC",
|
||||
borderRadius: "0px 0px 0px 20px"
|
||||
}}
|
||||
onClick={() => this.viweinfo(this.props.rec[k][i])}
|
||||
>
|
||||
<img
|
||||
style={{
|
||||
width: "64px",
|
||||
height: "64px"
|
||||
}}
|
||||
src={this.props.icons[pn.Name.split("/")[1]]}
|
||||
/>
|
||||
<div style={{}}>
|
||||
<span
|
||||
style={{
|
||||
color: "red",
|
||||
width: "100%",
|
||||
overflow: "clip",
|
||||
fontSize: "1.2em"
|
||||
}}
|
||||
key={pn.Name}
|
||||
>
|
||||
{pn.Name.split("/")[1]}
|
||||
</span>
|
||||
<div>{pn.Description}</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
))}
|
||||
<div
|
||||
id="info"
|
||||
style={{
|
||||
position: "fixed",
|
||||
top: "0px",
|
||||
left: this.posiLetf,
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
background: "#2e323f",
|
||||
display: "none"
|
||||
}}
|
||||
></div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -1,17 +0,0 @@
|
||||
import React from "react";
|
||||
|
||||
class New extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<h2>Новости</h2>
|
||||
<ol>
|
||||
{this.props.news.map((newItem, i) => (
|
||||
<li style={{fontSize: "1.2em"}}><b>{newItem.title}</b></li>
|
||||
))}
|
||||
</ol>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default New;
|
||||
@ -1,85 +0,0 @@
|
||||
import React from "react";
|
||||
//import "../Componets/style.css";
|
||||
const title = { name: "Имя", discription: "Описание", homepage: "Сайт" };
|
||||
import "./style.css";
|
||||
class PageOverlays extends React.Component {
|
||||
VVSB = false;
|
||||
viewSideBar() {
|
||||
if (!this.VVSB) {
|
||||
document.getElementById("MainContent").style.paddingLeft = "300px";
|
||||
document.getElementById("btn-toggle").style.float = "righ";
|
||||
document.getElementById("navBar").style.left = "0px";
|
||||
this.VVSB = true;
|
||||
} else {
|
||||
document.getElementById("MainContent").style.paddingLeft = "0px";
|
||||
document.getElementById("navBar").style.left = "-280px";
|
||||
this.VVSB = false;
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<h2>Оверлеи</h2>
|
||||
<hr />
|
||||
<ul style={{ listStyle: "none" }}>
|
||||
{this.props.repositores.map((over, i) => (
|
||||
<div
|
||||
className="flex_tab "
|
||||
key={i}
|
||||
style={{
|
||||
padding: "5px",
|
||||
fontSize: "1.2em",
|
||||
textAlign: "left",
|
||||
width: "80vw"
|
||||
}}
|
||||
>
|
||||
<li
|
||||
style={{
|
||||
border: "1px dotted #AAA",
|
||||
boxShadow: "3px 4px 10px #CDC",
|
||||
borderRadius: "0px"
|
||||
}}
|
||||
>
|
||||
<h3 style={{ textAlign: "center" }}>
|
||||
<b>{over.name}</b>{" "}
|
||||
</h3>
|
||||
|
||||
<span>{title.discription}:</span>
|
||||
<b style={{}}> {over.description} </b>
|
||||
|
||||
<div
|
||||
className=" btn-group"
|
||||
style={{
|
||||
display: "flex",
|
||||
margin: "10px",
|
||||
float: "right"
|
||||
}}
|
||||
>
|
||||
<div classname="btn" style={{}}>
|
||||
<a
|
||||
style={{
|
||||
background: "orange",
|
||||
color: "#FFF",
|
||||
textDecoration: "none",
|
||||
padding: "10px"
|
||||
}}
|
||||
href={over.homepage}
|
||||
>
|
||||
{" "}
|
||||
{title.homepage}
|
||||
</a>
|
||||
</div>
|
||||
<div className="btn ">
|
||||
<span>Добавить</span>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default PageOverlays;
|
||||
@ -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,35 +0,0 @@
|
||||
import React from "react";
|
||||
import CheckField from "../Componets/CheckField";
|
||||
import { FormGroup, FormControlLabel, Switch } from "@material-ui/core";
|
||||
//import Menu from "../Componets/menu";
|
||||
const menuItm = [
|
||||
{ name: "portage", text: "portage", url: "/sport" },
|
||||
{ name: "webpp", text: "App", url: "/app" }
|
||||
];
|
||||
class PageSettings extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="settings">
|
||||
<h2>Настройки</h2>
|
||||
<hr />
|
||||
<div>
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
<CheckField text={"Искать в оврелях"} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default PageSettings;
|
||||
@ -1,17 +0,0 @@
|
||||
const styles = {
|
||||
splash: {
|
||||
position: "fixed",
|
||||
width: "100vw",
|
||||
height: "100vh",
|
||||
background: "#2e323f",
|
||||
h1: {
|
||||
color: "#AAA",
|
||||
contentAlign: "center"
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function Splash() {
|
||||
return <div style={styles.splash}></div>;
|
||||
}
|
||||
export default Splash;
|
||||
@ -1,487 +0,0 @@
|
||||
@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 0px 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;
|
||||
}
|
||||
.pro-sidebar .pro-menu .pro-menu-item > .pro-inner-item > .pro-item-content {
|
||||
overflow: inherit;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@ -1,5 +0,0 @@
|
||||
{
|
||||
"template": "create-react-app",
|
||||
"hardReloadOnChange": true,
|
||||
"infiniteLoopProtection": true
|
||||
}
|
||||
@ -1,16 +0,0 @@
|
||||
body,
|
||||
html {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.app {
|
||||
display: flex;
|
||||
background-color: var(--main-bg-color);
|
||||
}
|
||||
|
||||
.context {
|
||||
flex: 1;
|
||||
height: 100vh;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue