Compare commits
12 Commits
tangjian(T
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
58523423d5 | ||
|
|
c990ace677 | ||
|
|
0ceb87b234 | ||
|
|
2751816113 | ||
|
|
cd817c479e | ||
|
|
a3f4ea5af7 | ||
|
|
9a51189ec3 | ||
|
|
dda4b377fe | ||
|
|
6c2ef50d74 | ||
|
|
493456c839 | ||
|
|
d6ce344331 | ||
|
|
06dc2b3dd1 |
41
.dockerignore
Normal file
41
.dockerignore
Normal file
@@ -0,0 +1,41 @@
|
|||||||
|
### Java template
|
||||||
|
# Compiled class file
|
||||||
|
*.class
|
||||||
|
# Log file
|
||||||
|
*.log
|
||||||
|
# BlueJ files
|
||||||
|
*.ctxt
|
||||||
|
# Mobile Tools for Java (J2ME)
|
||||||
|
.mtj.tmp/
|
||||||
|
# Package Files #
|
||||||
|
*.jar
|
||||||
|
*.war
|
||||||
|
*.nar
|
||||||
|
*.ear
|
||||||
|
*.zip
|
||||||
|
*.tar.gz
|
||||||
|
*.rar
|
||||||
|
# virtual machine crash logs, see http://www.java.com/en/download/help/error_hotspot.xml
|
||||||
|
hs_err_pid*
|
||||||
|
### Maven template
|
||||||
|
target/
|
||||||
|
pom.xml.tag
|
||||||
|
pom.xml.releaseBackup
|
||||||
|
pom.xml.versionsBackup
|
||||||
|
pom.xml.next
|
||||||
|
release.properties
|
||||||
|
dependency-reduced-pom.xml
|
||||||
|
buildNumber.properties
|
||||||
|
.mvn/timing.properties
|
||||||
|
# https://github.com/takari/maven-wrapper#usage-without-binary-jar
|
||||||
|
.mvn/wrapper/maven-wrapper.jar
|
||||||
|
### Example user template template
|
||||||
|
### Example user template
|
||||||
|
# IntelliJ project files
|
||||||
|
.idea
|
||||||
|
*.iml
|
||||||
|
out
|
||||||
|
gen
|
||||||
|
!build
|
||||||
|
!default.conf
|
||||||
|
!nginx.conf
|
||||||
107
.drone.yml
Normal file
107
.drone.yml
Normal file
@@ -0,0 +1,107 @@
|
|||||||
|
kind: pipeline
|
||||||
|
type: docker
|
||||||
|
name: fateverse-react
|
||||||
|
steps:
|
||||||
|
- name: build-package
|
||||||
|
image: registry.cn-chengdu.aliyuncs.com/claywang/node:16.20.0
|
||||||
|
volumes:
|
||||||
|
- name: cache
|
||||||
|
path: /drone/src/node_modules
|
||||||
|
- name: build
|
||||||
|
path: /app/build
|
||||||
|
commands:
|
||||||
|
- export CI=false
|
||||||
|
- mkdir -p /app/build/$DRONE_REPO_NAME
|
||||||
|
- rm -rf /app/build/$DRONE_REPO_NAME/*
|
||||||
|
- cp deployment.yml /app/build/$DRONE_REPO_NAME/
|
||||||
|
- cp Dockerfile /app/build/$DRONE_REPO_NAME/
|
||||||
|
- cp .dockerignore /app/build/$DRONE_REPO_NAME/
|
||||||
|
- cp default.conf /app/build/$DRONE_REPO_NAME/
|
||||||
|
- cp docker.sh /app/build/$DRONE_REPO_NAME/
|
||||||
|
- cp nginx.conf /app/build/$DRONE_REPO_NAME/
|
||||||
|
- npm -v
|
||||||
|
- mkdir -p ./node_modules
|
||||||
|
- export NODE_MODULES_PATH=`pwd`/node_modules
|
||||||
|
- npm config set registry https://registry.npm.taobao.org
|
||||||
|
- set NODE_OPTIONS=--openssl-legacy-provider
|
||||||
|
- npm install
|
||||||
|
- npm run build
|
||||||
|
- ls /app/build/$DRONE_REPO_NAME/
|
||||||
|
- echo $NODE_MODULES_PATH
|
||||||
|
- cp -r dist /app/build/$DRONE_REPO_NAME
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
- name: build-docker # 制作docker镜像
|
||||||
|
image: docker # 使用官方docker镜像
|
||||||
|
volumes: # 将容器内目录挂载到宿主机
|
||||||
|
- name: build
|
||||||
|
path: /app/build
|
||||||
|
- name: docker
|
||||||
|
path: /var/run/docker.sock # 挂载宿主机的docker
|
||||||
|
- name: config
|
||||||
|
path: /config
|
||||||
|
environment: # 获取到密文的docker用户名和密码
|
||||||
|
DOCKER_USERNAME:
|
||||||
|
from_secret: docker_username
|
||||||
|
DOCKER_PASSWORD:
|
||||||
|
from_secret: docker_password
|
||||||
|
REGISTRY:
|
||||||
|
from_secret: registry
|
||||||
|
REGISTRY_NAMESPACE:
|
||||||
|
from_secret: registry_namespace
|
||||||
|
commands: # 定义在Docker容器中执行的shell命令
|
||||||
|
- cd /app/build/$DRONE_REPO_NAME/
|
||||||
|
- cat Dockerfile
|
||||||
|
- sed -i 's/$REGISTRY/'"$REGISTRY"'/' deployment.yml
|
||||||
|
- sed -i 's/$REGISTRY_NAMESPACE/'"$REGISTRY_NAMESPACE"'/' deployment.yml
|
||||||
|
- sed -i 's/$DRONE_REPO_NAME/'"$DRONE_REPO_NAME"'/' deployment.yml
|
||||||
|
- sed -i 's/$DRONE_COMMIT/'"$DRONE_COMMIT"'/' deployment.yml
|
||||||
|
# - sed -i 's/$DRONE_COMMIT/'"$DRONE_COMMIT"'/' docker.sh
|
||||||
|
# - sed -i 's/$DRONE_REPO_NAME/'"$DRONE_REPO_NAME"'/' docker.sh
|
||||||
|
# docker登录,不能在脚本中登录,并且不能使用docker login -u -p
|
||||||
|
- echo $DOCKER_PASSWORD | docker login $REGISTRY --username $DOCKER_USERNAME --password-stdin
|
||||||
|
- chmod +x docker.sh
|
||||||
|
- cat docker.sh
|
||||||
|
- sh docker.sh
|
||||||
|
# 执行完脚本删除本次制作的docker镜像,避免多次后当前runner空间不足
|
||||||
|
- docker rmi -f $(docker images | grep $DRONE_REPO_NAME | awk '{print $3}')
|
||||||
|
|
||||||
|
|
||||||
|
- name: drone-rancher # rancher运行
|
||||||
|
image: registry.cn-chengdu.aliyuncs.com/claywang/kubectl #阿里云的kubectl镜像,里面包含kubectl命令行工具
|
||||||
|
volumes: # 将容器内目录挂载到宿主机
|
||||||
|
- name: build
|
||||||
|
path: /app/build # 将应用打包好的Jar和执行脚本挂载出来
|
||||||
|
- name: config
|
||||||
|
path: /app/config # 将kubectl 配置文件挂载出来
|
||||||
|
commands: # 定义在Docker容器中执行的shell命令
|
||||||
|
- cd /app/build/$DRONE_REPO_NAME/
|
||||||
|
# 将deployment中定义的变量替换为drone中的内置变量
|
||||||
|
- cat deployment.yml
|
||||||
|
# 通过kubectl指令运行deployment.yml,并指定授权文件kubectl_conf.yml
|
||||||
|
# - kubectl apply -f deployment.yml -n $DRONE_COMMIT_BRANCH --kubeconfig=/app/config/kubectl_conf.yml
|
||||||
|
- kubectl apply -f deployment.yml -n dev --kubeconfig=/app/config/hcy-text-kubectl.yml
|
||||||
|
|
||||||
|
volumes:
|
||||||
|
- name: build
|
||||||
|
host:
|
||||||
|
path: /home/build
|
||||||
|
- name: cache
|
||||||
|
host:
|
||||||
|
path: /home/npm/cache
|
||||||
|
- name: config # k8s对接的配置文件
|
||||||
|
host:
|
||||||
|
path: /home/kubect
|
||||||
|
- name: maven-cache # maven的缓存文件
|
||||||
|
host:
|
||||||
|
path: /home/data/maven/cache
|
||||||
|
- name: docker # 宿主机中的docker
|
||||||
|
host:
|
||||||
|
path: /var/run/docker.sock
|
||||||
|
|
||||||
|
trigger:
|
||||||
|
branch:
|
||||||
|
- prod
|
||||||
|
event:
|
||||||
|
- push
|
||||||
@@ -2,20 +2,17 @@ module.exports = {
|
|||||||
root: true,
|
root: true,
|
||||||
env: { browser: true, es2020: true },
|
env: { browser: true, es2020: true },
|
||||||
extends: [
|
extends: [
|
||||||
"eslint:recommended",
|
'eslint:recommended',
|
||||||
"plugin:@typescript-eslint/recommended",
|
'plugin:@typescript-eslint/recommended',
|
||||||
"plugin:react-hooks/recommended",
|
'plugin:react-hooks/recommended',
|
||||||
],
|
],
|
||||||
ignorePatterns: ["dist", ".eslintrc.cjs"],
|
ignorePatterns: ['dist', '.eslintrc.cjs'],
|
||||||
parser: "@typescript-eslint/parser",
|
parser: '@typescript-eslint/parser',
|
||||||
plugins: ["react-refresh"],
|
plugins: ['react-refresh'],
|
||||||
rules: {
|
rules: {
|
||||||
"react-refresh/only-export-components": [
|
'react-refresh/only-export-components': [
|
||||||
"warn",
|
'warn',
|
||||||
{ allowConstantExport: true },
|
{ allowConstantExport: true },
|
||||||
],
|
],
|
||||||
"@typescript-eslint/no-explicit-any": "off",
|
|
||||||
"prefer-const": "off",
|
|
||||||
"@typescript-eslint/no-unused-vars": "off",
|
|
||||||
},
|
},
|
||||||
};
|
}
|
||||||
|
|||||||
9
Dockerfile
Normal file
9
Dockerfile
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
FROM nginx
|
||||||
|
RUN rm -rf /etc/nginx/nginx.conf
|
||||||
|
COPY nginx.conf /etc/nginx/
|
||||||
|
#RUN useradd -b /home/clay -m -s /bin/bash clay
|
||||||
|
#RUN chmod a+xr -R /home/clay && chown clay:clay -R /home/clay
|
||||||
|
#USER clay
|
||||||
|
COPY ./dist /home/clay
|
||||||
|
WORKDIR /home/clay
|
||||||
|
EXPOSE 80
|
||||||
49
deployment.yml
Normal file
49
deployment.yml
Normal file
@@ -0,0 +1,49 @@
|
|||||||
|
apiVersion: v1
|
||||||
|
kind: Service
|
||||||
|
metadata:
|
||||||
|
name: $DRONE_REPO_NAME
|
||||||
|
spec:
|
||||||
|
type: ClusterIP
|
||||||
|
ports:
|
||||||
|
- protocol: TCP
|
||||||
|
port: 80
|
||||||
|
targetPort: 80
|
||||||
|
selector:
|
||||||
|
app: $DRONE_REPO_NAME
|
||||||
|
|
||||||
|
---
|
||||||
|
apiVersion: apps/v1
|
||||||
|
kind: Deployment
|
||||||
|
metadata:
|
||||||
|
name: $DRONE_REPO_NAME
|
||||||
|
spec:
|
||||||
|
replicas: 1
|
||||||
|
selector:
|
||||||
|
matchLabels:
|
||||||
|
app: $DRONE_REPO_NAME
|
||||||
|
template:
|
||||||
|
metadata:
|
||||||
|
labels:
|
||||||
|
app: $DRONE_REPO_NAME
|
||||||
|
spec:
|
||||||
|
imagePullSecrets:
|
||||||
|
- name: harbor
|
||||||
|
containers:
|
||||||
|
- image: $REGISTRY/$REGISTRY_NAMESPACE/$DRONE_REPO_NAME:$DRONE_COMMIT
|
||||||
|
name: $DRONE_REPO_NAME
|
||||||
|
imagePullPolicy: Always
|
||||||
|
env:
|
||||||
|
- name: TIME_ZONE
|
||||||
|
value: Asia/Shanghai
|
||||||
|
- name: REF_NAME
|
||||||
|
value: dev
|
||||||
|
resources:
|
||||||
|
requests:
|
||||||
|
memory: 0.1Gi
|
||||||
|
cpu: 0.1
|
||||||
|
limits:
|
||||||
|
memory: 2Gi
|
||||||
|
cpu: 2
|
||||||
|
ports:
|
||||||
|
- containerPort: 8080
|
||||||
|
name: app-port
|
||||||
15
docker.sh
Normal file
15
docker.sh
Normal file
@@ -0,0 +1,15 @@
|
|||||||
|
#!/bin/sh
|
||||||
|
# 定义应用组名
|
||||||
|
group_name='clay'
|
||||||
|
# 定义应用名称
|
||||||
|
app_name=$DRONE_REPO_NAME
|
||||||
|
# 定义应用版本
|
||||||
|
app_version=$DRONE_COMMIT
|
||||||
|
echo ${app_version}
|
||||||
|
# 打包编译docker镜像
|
||||||
|
echo '----build image start----'
|
||||||
|
docker build -t ${group_name}/${app_name} .
|
||||||
|
echo '----build image success----'
|
||||||
|
docker tag ${group_name}/${app_name} $REGISTRY/$REGISTRY_NAMESPACE/${app_name}:${app_version}
|
||||||
|
docker push $REGISTRY/$REGISTRY_NAMESPACE/${app_name}:${app_version}
|
||||||
|
echo 'push success'
|
||||||
50
nginx.conf
Normal file
50
nginx.conf
Normal file
@@ -0,0 +1,50 @@
|
|||||||
|
user nginx;
|
||||||
|
worker_processes auto;
|
||||||
|
|
||||||
|
error_log /var/log/nginx/error.log notice;
|
||||||
|
pid /var/run/nginx.pid;
|
||||||
|
|
||||||
|
|
||||||
|
events {
|
||||||
|
worker_connections 1024;
|
||||||
|
}
|
||||||
|
http {
|
||||||
|
include /etc/nginx/mime.types;
|
||||||
|
default_type application/octet-stream;
|
||||||
|
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
|
||||||
|
'$status $body_bytes_sent "$http_referer" '
|
||||||
|
'"$http_user_agent" "$http_x_forwarded_for"';
|
||||||
|
|
||||||
|
add_header 'Access-Control-Allow-Origin' '*';
|
||||||
|
add_header 'Access-Control-Allow-Headers' '*';
|
||||||
|
add_header 'Access-Control-Allow-Methods' '*';
|
||||||
|
|
||||||
|
access_log /var/log/nginx/access.log main;
|
||||||
|
|
||||||
|
sendfile on;
|
||||||
|
|
||||||
|
keepalive_timeout 65;
|
||||||
|
|
||||||
|
server {
|
||||||
|
listen 80;
|
||||||
|
listen [::]:80;
|
||||||
|
|
||||||
|
location /api {
|
||||||
|
proxy_pass http://gateway.dev.svc.cluster.local:8080;
|
||||||
|
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
proxy_set_header X-Forwarded-Port $server_port;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
rewrite "^/api/(.*)$" /$1 break;
|
||||||
|
proxy_http_version 1.1;
|
||||||
|
proxy_set_header Upgrade $http_upgrade;
|
||||||
|
proxy_set_header Connection 'upgrade';
|
||||||
|
}
|
||||||
|
|
||||||
|
location / {
|
||||||
|
root /home/clay;
|
||||||
|
index index.html index.htm;
|
||||||
|
try_files $uri $uri/ /index.html;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -19,7 +19,6 @@
|
|||||||
"nprogress": "^0.2.0",
|
"nprogress": "^0.2.0",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"react-echarts-core": "^1.0.2",
|
|
||||||
"react-redux": "^8.1.2",
|
"react-redux": "^8.1.2",
|
||||||
"react-router-dom": "^6.15.0",
|
"react-router-dom": "^6.15.0",
|
||||||
"redux-persist": "^6.0.0",
|
"redux-persist": "^6.0.0",
|
||||||
|
|||||||
@@ -1,174 +0,0 @@
|
|||||||
import { useState, useRef, useEffect } from "react";
|
|
||||||
import "../index.scss";
|
|
||||||
import { Button, Select } from "antd";
|
|
||||||
// import type { EChartsOption } from "node_modules/react-echarts-core/lib/ChartCore";
|
|
||||||
// import ChartCore from "node_modules/react-echarts-core/lib/ChartCore";
|
|
||||||
import * as echarts from "echarts";
|
|
||||||
export default function EchartsEditor() {
|
|
||||||
const echartRef: any = useRef(null);
|
|
||||||
const [xList, setXList] = useState<any[]>([]);
|
|
||||||
const [yList, setYList] = useState<any[]>([]);
|
|
||||||
const [currentDrag, setCurrentDrag] = useState<any>({});
|
|
||||||
const [dataList, setDataList] = useState<any[]>([
|
|
||||||
{ id: 1, name: "Vue", state: "Value" },
|
|
||||||
{ id: 2, name: "React", state: "Value" },
|
|
||||||
{ id: 3, name: "Angular", state: "Key" },
|
|
||||||
]);
|
|
||||||
const [echartOption, setEchartOption] = useState<object | any>({
|
|
||||||
xAxis: {
|
|
||||||
data: ["A", "B", "C", "D", "E"],
|
|
||||||
},
|
|
||||||
yAxis: {
|
|
||||||
type: "value",
|
|
||||||
},
|
|
||||||
series: [
|
|
||||||
{
|
|
||||||
data: [1, 2, 3, 4, 5],
|
|
||||||
type: "line",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
});
|
|
||||||
|
|
||||||
const onDragStart: any = (item: any) => {
|
|
||||||
console.log(item.name, "开始拖拽");
|
|
||||||
setCurrentDrag(item);
|
|
||||||
};
|
|
||||||
|
|
||||||
const onDragEnd: any = (item: any) => {
|
|
||||||
console.log(item.name, "结束拖拽");
|
|
||||||
};
|
|
||||||
|
|
||||||
const onYDragOver: any = (e: any) => {
|
|
||||||
e.preventDefault();
|
|
||||||
};
|
|
||||||
|
|
||||||
const onXDrop: any = () => {
|
|
||||||
console.log("拖拽至X轴区域");
|
|
||||||
setXList(xList.concat(currentDrag));
|
|
||||||
let newDataList = handleDelDataList(currentDrag.id);
|
|
||||||
setDataList(newDataList);
|
|
||||||
setEchartOption({
|
|
||||||
...echartOption,
|
|
||||||
xAxis: {
|
|
||||||
data: xList.map((item) => item.name),
|
|
||||||
},
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const onXDragOver: any = (e: any) => {
|
|
||||||
e.preventDefault();
|
|
||||||
};
|
|
||||||
|
|
||||||
const onYDrop: any = () => {
|
|
||||||
console.log("拖拽至Y轴区域");
|
|
||||||
console.log("拖拽至Y轴区域");
|
|
||||||
console.log("拖拽至Y轴区域");
|
|
||||||
console.log("拖拽至Y轴区域");
|
|
||||||
setYList(yList.concat(currentDrag));
|
|
||||||
let newDataList = handleDelDataList(currentDrag.id);
|
|
||||||
setDataList(newDataList);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleDelDataList = (id: number) => {
|
|
||||||
let newDataList = dataList;
|
|
||||||
const curIndex = newDataList.findIndex((item) => item.id === id);
|
|
||||||
newDataList.splice(curIndex, 1);
|
|
||||||
return newDataList;
|
|
||||||
};
|
|
||||||
|
|
||||||
// const res = () => {
|
|
||||||
// let res: any[] = [];
|
|
||||||
// setXList(xList);
|
|
||||||
// xList.forEach((item: any) => {
|
|
||||||
// res.push(item.name);
|
|
||||||
// });
|
|
||||||
// setXEchartList(res);
|
|
||||||
// console.log(xEchartList);
|
|
||||||
// return xEchartList;
|
|
||||||
// };
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const myEchart: any = echarts.init(document.querySelector(".canvas"));
|
|
||||||
myEchart.setOption(echartOption);
|
|
||||||
console.log(echartOption);
|
|
||||||
}, [echartOption]);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="controller">
|
|
||||||
<div className="data bg">
|
|
||||||
<Select
|
|
||||||
placeholder="折线图"
|
|
||||||
allowClear
|
|
||||||
style={{ width: 100 + "%" }}
|
|
||||||
options={[{ value: "折线图", label: "折线图" }]}
|
|
||||||
/>
|
|
||||||
{dataList.map((item: any) => {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="list-item"
|
|
||||||
key={item.id}
|
|
||||||
draggable={true}
|
|
||||||
onDragStart={() => onDragStart(item)}
|
|
||||||
onDragEnd={() => onDragEnd(item)}
|
|
||||||
>
|
|
||||||
{item.name}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
className="index-x bg"
|
|
||||||
onDragOver={onXDragOver}
|
|
||||||
onDrop={() => onXDrop()}
|
|
||||||
>
|
|
||||||
<span>值轴/X轴</span>
|
|
||||||
{xList.map((item: any) => {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="list-item"
|
|
||||||
key={item.id}
|
|
||||||
// draggable={true}
|
|
||||||
// onDragStart={() => onDragStart(item)}
|
|
||||||
// onDragEnd={() => onDragEnd(item)}
|
|
||||||
>
|
|
||||||
{item.name}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
className="index-y bg"
|
|
||||||
onDragOver={onYDragOver}
|
|
||||||
onDrop={() => onYDrop()}
|
|
||||||
>
|
|
||||||
<span>值轴/y轴</span>
|
|
||||||
{yList.map((item: any) => {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className="list-item"
|
|
||||||
key={item.id}
|
|
||||||
// draggable={true}
|
|
||||||
// onDragStart={() => onDragStart(item)}
|
|
||||||
// onDragEnd={() => onDragEnd(item)}
|
|
||||||
>
|
|
||||||
{item.name}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="center-edit">
|
|
||||||
<div></div>
|
|
||||||
</div>
|
|
||||||
<div className="center-edit">
|
|
||||||
<Button>保存</Button>
|
|
||||||
<Button>高级设置</Button>
|
|
||||||
</div>
|
|
||||||
<div className="canvas" ref={echartRef}>
|
|
||||||
{/* <ChartCore option={option}></ChartCore> */}
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,38 +0,0 @@
|
|||||||
.controller {
|
|
||||||
display: flex;
|
|
||||||
.bg {
|
|
||||||
text-align: left;
|
|
||||||
box-shadow: 1px 1px 3px 1px #ddd;
|
|
||||||
background-color: #fff;
|
|
||||||
height: 40vh;
|
|
||||||
padding: 10px;
|
|
||||||
margin: 5px;
|
|
||||||
}
|
|
||||||
.list-item {
|
|
||||||
width: 95%;
|
|
||||||
margin: 10px auto;
|
|
||||||
height: 50px;
|
|
||||||
padding: 10px;
|
|
||||||
font-size: 20px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
}
|
|
||||||
.data {
|
|
||||||
flex: 25%;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
.index-x {
|
|
||||||
flex: 40%;
|
|
||||||
}
|
|
||||||
.index-y {
|
|
||||||
flex: 40%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.center-edit {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.canvas {
|
|
||||||
width: 800px;
|
|
||||||
height: 400px;
|
|
||||||
background-color: pink;
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user