跨平台代码同步静态页面
This commit is contained in:
parent
22b9990893
commit
5678fa0232
|
|
@ -13,10 +13,20 @@ const Data = Loadable({
|
|||
loader: () => import('./data'),
|
||||
loading: Loading,
|
||||
})
|
||||
// 跨平台代码同步服务
|
||||
const Reposyncer = Loadable({
|
||||
loader: () => import('./reposyncer'),
|
||||
loading: Loading,
|
||||
})
|
||||
function ServerIndex(props){
|
||||
return(
|
||||
<div className="panels">
|
||||
<Switch {...props}>
|
||||
<Route path="/:owner/:projectsId/server/reposyncer"
|
||||
render={
|
||||
() => (<Reposyncer {...props}/>)
|
||||
}
|
||||
></Route>
|
||||
<Route path="/:owner/:projectsId/server/:id"
|
||||
render={
|
||||
() => (<Data {...props}/>)
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import React,{useState , useEffect} from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import AgreementModal from './agreementModal';
|
||||
|
||||
function Main(props){
|
||||
|
|
@ -41,6 +42,16 @@ function Main(props){
|
|||
<a onClick={openDetail} className="btnhover">查看详情</a>
|
||||
</span>
|
||||
</li>
|
||||
<li>
|
||||
<span className="servername">
|
||||
<img src={require('./img/logo.png')} alt=""/>
|
||||
<Link to={`/${owner}/${projectsId}/server/reposyncer`}>Reposyncer仓库同步系统</Link>
|
||||
</span>
|
||||
<p className="task-hide-2 serverdesc">支持不同开源托管平台自动同步推送/拉取相关代码，实现多平台项目同步开发功能</p>
|
||||
<span className="serverbtn">
|
||||
<Link to={`/${owner}/${projectsId}/server/reposyncer`} className="btnhover">查看详情</Link>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
|
|
@ -0,0 +1,8 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="23.589" height="23.589" viewBox="0 0 23.589 23.589">
|
||||
<g id="gitee" transform="translate(0)">
|
||||
<g id="Group" transform="translate(0 0)">
|
||||
<ellipse id="Combined-Shape" cx="11.795" cy="11.795" rx="11.795" ry="11.795" fill="#c71d23"/>
|
||||
<path id="G" d="M32.458,25.178h-6.7a.583.583,0,0,0-.583.582v1.456a.582.582,0,0,0,.582.583h4.078a.582.582,0,0,1,.582.582h0v.146h0v.146a1.747,1.747,0,0,1-1.747,1.747H23.138a.582.582,0,0,1-.582-.582V24.3A1.747,1.747,0,0,1,24.3,22.557h8.153a.584.584,0,0,0,.583-.582V20.518a.582.582,0,0,0-.582-.583H24.3A4.368,4.368,0,0,0,19.935,24.3v8.154a.582.582,0,0,0,.582.582h8.591a3.931,3.931,0,0,0,3.931-3.931V25.76A.582.582,0,0,0,32.458,25.178Z" transform="translate(-14.693 -14.693)" fill="#fff" fill-rule="evenodd"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 822 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="23.585" height="23.587" viewBox="0 0 23.585 23.587">
|
||||
<path id="路径_46" data-name="路径 46" d="M11.831,0A11.914,11.914,0,0,0,.136,10.156,12.116,12.116,0,0,0,8.089,23.568c.6.111.806-.267.806-.586V20.925c-3.306.735-4-1.626-4-1.626a3.23,3.23,0,0,0-1.315-1.774c-1.068-.742.087-.742.087-.742A2.492,2.492,0,0,1,5.473,18.03,2.539,2.539,0,0,0,6.99,19.266a2.481,2.481,0,0,0,1.927-.226,2.593,2.593,0,0,1,.727-1.618c-2.63-.3-5.391-1.344-5.391-5.938A4.734,4.734,0,0,1,5.466,8.239a4.5,4.5,0,0,1,.116-3.2s1-.327,3.255,1.24a10.968,10.968,0,0,1,5.929,0c2.26-1.566,3.248-1.24,3.248-1.24a4.475,4.475,0,0,1,.145,3.177,4.734,4.734,0,0,1,1.213,3.244c0,4.647-2.768,5.664-5.406,5.938a2.893,2.893,0,0,1,.806,2.227c0,1.618,0,2.925,0,3.318s.211.7.814.579a12.12,12.12,0,0,0,7.824-13.379A11.917,11.917,0,0,0,11.831,0Z" transform="translate(0.018 0)" fill="#1a1414" fill-rule="evenodd"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 952 B |
Binary file not shown.
|
After Width: | Height: | Size: 6.5 KiB |
|
|
@ -0,0 +1,57 @@
|
|||
import React, {forwardRef, useState} from "react";
|
||||
import { Button, Form, Input } from "antd";
|
||||
import gitHub from '../../img/github.png';
|
||||
import gitee from '../../img/gitee.png';
|
||||
import '../index.scss';
|
||||
|
||||
function EditStore(props){
|
||||
const { form, history} = props;
|
||||
const { getFieldDecorator, validateFields , setFieldsValue } = form;
|
||||
|
||||
return <div className="storeListBox">
|
||||
<div className="registerBox">
|
||||
<Form>
|
||||
<div className="storeTitle pb10 mb15"><img src={gitHub} alt="" className="storeLogo"/></div>
|
||||
<Form.Item label="Github同步仓库地址" className="storeFormItem">
|
||||
{getFieldDecorator("gitHubUrl",{
|
||||
rules:[]
|
||||
})(
|
||||
<Input placeholder="请输入Github目标版本库地址" className="storeInput"/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<Form.Item label="Github同步仓库授权验证" className="storeFormItem">
|
||||
{getFieldDecorator("gitHubToken",{
|
||||
rules:[]
|
||||
})(
|
||||
<Input addonBefore="token" placeholder="请输入Github的授权token" className="storeInput"/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<div className="storeTitle pb10 mb15 pt20"><img src={gitee} alt="" className="storeLogo"/></div>
|
||||
<Form.Item label="Gitee同步仓库地址" className="storeFormItem">
|
||||
{getFieldDecorator("giteeUrl",{
|
||||
rules:[]
|
||||
})(
|
||||
<Input placeholder="请输入Gitee目标版本库地址" className="storeInput"/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<Form.Item label="Github同步仓库授权验证" className="storeFormItem">
|
||||
{getFieldDecorator("giteeToken",{
|
||||
rules:[]
|
||||
})(
|
||||
<Input addonBefore="token" placeholder="请输入Gitee的授权token" className="storeInput"/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<div className="tipStoreBox">
|
||||
1、在开启仓库同步前，您需要绑定并授权目标同步仓库<br/>
|
||||
2、完成仓库绑定后，任意已绑定仓库有代码提交、代码推送及合并请求更新，将实时同步更新至其他仓库<br/>
|
||||
3、目前仅提供Github与Gitee平台的仓库同步功能，每个平台支持同时同步一个仓库
|
||||
</div>
|
||||
<Form.Item>
|
||||
<Button type="primary" style={{width: '112px', height: '36px'}}>确认绑定</Button>
|
||||
<Button style={{width: '112px', height: '36px'}} className="ml40" onClick={()=>{history.goBack(-1)}}>取消</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
export default Form.create()(forwardRef(EditStore));
|
||||
|
|
@ -0,0 +1,84 @@
|
|||
import React, {useState} from "react";
|
||||
import { Table } from 'antd';
|
||||
import gitHub from '../../img/github.png';
|
||||
import gitee from '../../img/gitee.png';
|
||||
import '../index.scss';
|
||||
|
||||
function RecordList(props){
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [data, setData] = useState([{id: 1, name: 'gitHub', content: 'commit', time: '2022.5.12', status: '0', last: 'aaaaaa', info: 'hajahjah'}]);
|
||||
// table
|
||||
const [current, setCurrent] = useState(1);
|
||||
const [total, setTotal] = useState(0);
|
||||
const [pageSize, setPageSize] = useState(20);
|
||||
const [expandedRowKeys, setExpandedRowKeys] = useState([]);
|
||||
|
||||
const columns = [
|
||||
{ title: '序号', dataIndex: 'index', className:"recordColumns", render: (text, item, index) => <span>{(current-1)*pageSize+index + 1}</span> },
|
||||
{ title: '同步平台', dataIndex: 'name', className:"recordColumns taskName", render: (text, item) => text === 'gitHub' ? <img src={gitHub} alt="" width={76}/> : <img src={gitee} alt="" width={76} /> },
|
||||
{ title: '同步内容', dataIndex: 'content', className:"recordColumns"},
|
||||
{ title: '同步时间', dataIndex: 'time', className:"recordColumns"},
|
||||
{ title: '同步状态', dataIndex: 'status', className:"recordColumns", render: (text) => text === '0' ? <span className="errorBox statusBox">错误</span> : <span className="accomplish statusBox">完成</span> },
|
||||
{ title: '最后一次哈希值', dataIndex: 'last', className:"primaryColor recordColumns"},
|
||||
{ title: '同步日志', dataIndex: 'action', align: 'center', className:"primaryColor recordColumns"},
|
||||
]
|
||||
|
||||
const customExpandIcon = (props) => {
|
||||
if (props.expanded) {
|
||||
return <a className='primaryColor' onClick={e => {
|
||||
props.onExpand(props.record, e);
|
||||
}}>查看<i className="iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu- font-12 ml5 down mr10"></i></a>
|
||||
} else {
|
||||
return <a className='primaryColor' onClick={e => {
|
||||
props.onExpand(props.record, e);
|
||||
}}>查看<i className="iconfont icon-jiantou9 font-12 ml5 down mr10"></i></a>
|
||||
}
|
||||
}
|
||||
|
||||
const expandRow = (record) => {
|
||||
return <div>
|
||||
{record.info}
|
||||
</div>
|
||||
}
|
||||
|
||||
// 展开收起行回调
|
||||
function onExpand(expanded, record){
|
||||
const keys = new Set(expandedRowKeys);
|
||||
if(expanded){
|
||||
keys.add(record.id);
|
||||
}else{
|
||||
keys.delete(record.id);
|
||||
}
|
||||
setExpandedRowKeys(Array.from(keys));
|
||||
}
|
||||
|
||||
// 改变pagesize
|
||||
function onShowSizeChange(current, pageSize){
|
||||
window.scrollTo(0, 0);
|
||||
setCurrent(1);
|
||||
setPageSize(pageSize);
|
||||
}
|
||||
|
||||
// 切换页数
|
||||
function changePage(page, pageSize){
|
||||
window.scrollTo(0, 0);
|
||||
setCurrent(page);
|
||||
}
|
||||
|
||||
return <div className="storeListBox">
|
||||
<Table
|
||||
loading={loading}
|
||||
columns={columns}
|
||||
dataSource={data}
|
||||
expandedRowRender={expandRow}
|
||||
expandIconColumnIndex={6}
|
||||
expandIconAsCell={false}
|
||||
expandIcon={customExpandIcon}
|
||||
rowKey={'id'}
|
||||
expandedRowKeys={expandedRowKeys}
|
||||
onExpand={onExpand}
|
||||
pagination={{current: current, pageSize: pageSize, total: total, showSizeChanger: true, onShowSizeChange:onShowSizeChange, showQuickJumper: true, onChange: changePage}}
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
export default RecordList;
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
import React, { useState} from "react";
|
||||
import { Button, Modal } from "antd";
|
||||
import { Link } from "react-router-dom";
|
||||
import gitHub1 from '../../img/github2.svg';
|
||||
import gitee1 from '../../img/gitee1.svg';
|
||||
import '../index.scss';
|
||||
|
||||
function StoreList(props){
|
||||
const { owner , projectsId } = props.match.params;
|
||||
const [info, setInfo] = useState({gitHub: 'aaaaaaaa', gitee: 'bbbbbbbbb'});
|
||||
const [visible, setVisible] = useState(false);
|
||||
|
||||
function updateStore(){
|
||||
|
||||
}
|
||||
return <div className="storeListBox">
|
||||
<div className="listStore">
|
||||
<div className="storeTitle pb5 mb5 font-18">已绑定仓库地址</div>
|
||||
<div className="showStoreInfo dashedBor">
|
||||
<div className="infoBox">
|
||||
<div className="font-15 sTil"><img src={gitHub1} alt="" className="mr10"/><span>Github仓库地址</span></div>
|
||||
<div>{info.gitHub}</div>
|
||||
</div>
|
||||
<Button style={{width: '88px', height:'36px'}} className="red_border_but" onClick={()=>{setVisible(true)}}>取消绑定</Button>
|
||||
</div>
|
||||
<div className="showStoreInfo">
|
||||
<div className="infoBox">
|
||||
<div className="font-15 sTil"><img src={gitee1} alt="" className="mr10"/><span>Gitee仓库地址</span></div>
|
||||
<div>{info.gitee}</div>
|
||||
</div>
|
||||
<Button style={{width: '88px', height:'36px'}} className="red_border_but">取消绑定</Button>
|
||||
</div>
|
||||
<Button type="primary" style={{width: '134px', height:'36px', padding: 0}} className="mt30"><Link to={`/${owner}/${projectsId}/server/reposyncer/store/edit`}>更改绑定仓库信息</Link></Button>
|
||||
</div>
|
||||
<Modal
|
||||
title="取消绑定"
|
||||
visible={visible}
|
||||
onOk={updateStore}
|
||||
onCancel={()=>{setVisible(false)}}
|
||||
footer={<div><Button style={{width: '104px', height:'36px'}} onClick={()=>{setVisible(false)}}>取消</Button><Button className="okBut" style={{width: '104px', height:'36px'}}>确认取消</Button></div>}
|
||||
width={486}
|
||||
className="cancelBound"
|
||||
>
|
||||
<div className="bTilModal font-16"><span className="errorRedSpan font-18 mr20 mt20 ml15">!</span>您确定要取消此仓库地址的绑定吗？</div>
|
||||
<div className="sTilModal">缺文案</div>
|
||||
</Modal>
|
||||
</div>
|
||||
}
|
||||
export default StoreList;
|
||||
|
|
@ -0,0 +1,76 @@
|
|||
import React, {useState} from "react";
|
||||
import { Button, Tooltip } from "antd";
|
||||
import './index.scss';
|
||||
import logo from '../img/logo2.png';
|
||||
import Loadable from "react-loadable";
|
||||
import { Route, Switch } from "react-router";
|
||||
import Loading from "../../../Loading";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
// 编辑同步仓库页面
|
||||
const EditStore = Loadable({
|
||||
loader: () => import("./component/editStore"),
|
||||
loading: Loading,
|
||||
});
|
||||
// 同步仓库页面
|
||||
const StoreList = Loadable({
|
||||
loader: () => import("./component/storeList"),
|
||||
loading: Loading,
|
||||
});
|
||||
// 同步记录页面
|
||||
const RecordList = Loadable({
|
||||
loader: () => import("./component/recordList"),
|
||||
loading: Loading,
|
||||
});
|
||||
|
||||
function Reposyncer(propsF){
|
||||
const {pathname} = propsF.location;
|
||||
const { owner , projectsId } = propsF.match.params;
|
||||
|
||||
const [storeList, setStoreList] = useState([]);
|
||||
|
||||
return <div className="reposyncerBox">
|
||||
<div className="headBox font-16 pl15">Reposyncer仓库同步系统
|
||||
{(storeList.length !== 0) && <Tooltip title="Reposyncer仓库同步系统提供跨托管平台的项目协同开发同步功能。支持用户在任何一个托管平台上的代码提交、代码推送、合并请求等操作自动同步至其他托管平台。不仅增加每个开源项目与开发者的流量，也使不同平台的开源项目维护与更新变得方便与快捷" overlayStyle={{width: 400}}><span className="helpBox1 font-12 ml10">?</span></Tooltip>}
|
||||
</div>
|
||||
{(storeList.length === 0 && pathname.endsWith('/reposyncer')) ? <div className="nullStoreBox mt25">
|
||||
<img src={logo} alt="" className="loBox mt50"/>
|
||||
<p className="font-22 mt10">欢迎使用跨平台代码同步系统</p>
|
||||
<div className="introBox font-15">跨平台代码同步系统提供跨托管平台的项目协同开发同步功能。支持用户在任何一个托管平台上的代码提交、代码推送、合并请求等操作自动同步至其他托管平台。不仅增加每个开源项目与开发者的流量，也使不同平台的开源项目维护与更新变得方便与快捷</div>
|
||||
<div className="borBox"></div>
|
||||
<Button type="primary" style={{width: '112px', height: '36px'}}><Link to={`/${owner}/${projectsId}/server/reposyncer/store/edit`}>开始体验</Link></Button>
|
||||
</div> : <div className="rightContentBox mt20">
|
||||
<div className="leftNav font-15">
|
||||
<Link to={`/${owner}/${projectsId}/server/reposyncer/store${storeList.length === 0 ? '/edit' : ''}`} className={`oneBox ${pathname.endsWith('/record') ? '' : 'active'}`}>仓库绑定</Link>
|
||||
<Link to={`/${owner}/${projectsId}/server/reposyncer/record`} className={`oneBox ${pathname.endsWith('/record') ? 'active' : ''}`}>同步记录</Link>
|
||||
</div>
|
||||
<Switch {...propsF}>
|
||||
<Route
|
||||
path="/:owner/:projectsId/server/reposyncer/store/edit"
|
||||
render={(props) => (
|
||||
<EditStore {...propsF} {...props}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/:owner/:projectsId/server/reposyncer/store"
|
||||
render={(props) => (
|
||||
<StoreList {...propsF} {...props}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/:owner/:projectsId/server/reposyncer/record"
|
||||
render={(props) => (
|
||||
<RecordList {...propsF} {...props}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/:owner/:projectsId/server/reposyncer"
|
||||
render={(props) => (
|
||||
<StoreList {...propsF} {...props} edit={false}/>
|
||||
)}
|
||||
></Route>
|
||||
</Switch>
|
||||
</div>}
|
||||
</div>
|
||||
}
|
||||
export default Reposyncer;
|
||||
|
|
@ -0,0 +1,217 @@
|
|||
.red_border_but, .red_border_but:focus{
|
||||
color:#f60011;
|
||||
background-color:rgba(196, 0, 14, 0.09);
|
||||
border:1px solid #f60011;
|
||||
border-radius:5px;
|
||||
&:hover{
|
||||
color:#f60011;
|
||||
background-color:rgba(196, 0, 14, 0.18);
|
||||
border-color:#ff727c;
|
||||
}
|
||||
&:active{
|
||||
color:#f60011;
|
||||
background-color:rgba(196, 0, 14, 0.22);
|
||||
border-color:#f60011;
|
||||
}
|
||||
}
|
||||
.reposyncerBox{
|
||||
padding-bottom: 60px;
|
||||
.headBox{
|
||||
height:60px;
|
||||
line-height: 60px;
|
||||
background-color:#fafcff;
|
||||
border:1px solid rgba(42, 97, 255, 0.23);
|
||||
border-radius:3px 3px 0px 0px;
|
||||
color:#333333;
|
||||
}
|
||||
.helpBox1{
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border-radius: 50%;
|
||||
color: white;
|
||||
background-color: #466aff;
|
||||
line-height: normal;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
cursor: default;
|
||||
}
|
||||
.nullStoreBox{
|
||||
background-color:#fafcff;
|
||||
border-radius:4px 4px 0px 0px;
|
||||
text-align: center;
|
||||
color:#333333;
|
||||
padding-bottom: 65px;
|
||||
.loBox{width: 68px;}
|
||||
.introBox{
|
||||
color:#666666;
|
||||
width: 57%;
|
||||
margin: 15px auto;
|
||||
}
|
||||
.borBox{
|
||||
width: 45%;
|
||||
margin: 0 auto 20px;
|
||||
border-bottom: 1px solid rgba(90, 117, 193, 0.23);
|
||||
}
|
||||
}
|
||||
.rightContentBox{
|
||||
display: flex;
|
||||
.leftNav{
|
||||
width: 185px;
|
||||
margin-right: 36px;
|
||||
background-size: 100% 100%;
|
||||
background-image: url('../img/bg1.png');
|
||||
.oneBox{
|
||||
padding: 15px;
|
||||
color:#4c5b76;
|
||||
display: block;
|
||||
&.active{
|
||||
position: relative;
|
||||
background-color:rgba(70, 106, 255, 0.06);
|
||||
color: $primary-color;
|
||||
&::before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 4px;
|
||||
height: 86%;
|
||||
left: 0;
|
||||
top: 4px;
|
||||
background-color: $primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.storeListBox{
|
||||
flex: 1;
|
||||
.storeTitle{
|
||||
font-weight:700;
|
||||
color:#151d40;
|
||||
border-bottom: 1px solid #e0e6f5;;
|
||||
}
|
||||
.registerBox{
|
||||
.storeLogo{
|
||||
width: 75px;
|
||||
}
|
||||
.storeFormItem{
|
||||
width: 70%;
|
||||
}
|
||||
#gitHubToken, #giteeToken, .storeInput{
|
||||
border-color: #9eaacb;
|
||||
height: 36px;
|
||||
&:hover{border-color: $primary-color;}
|
||||
}
|
||||
.storeInput .ant-input-group-addon{
|
||||
border-color: #9eaacb;
|
||||
}
|
||||
.tipStoreBox{
|
||||
color: #4c5b76;
|
||||
line-height: 30px;
|
||||
padding: 10px 0 30px;
|
||||
}
|
||||
}
|
||||
.listStore{
|
||||
.showStoreInfo{
|
||||
padding: 20px 0 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
&.dashedBor{
|
||||
border-bottom: 1px dashed #e0e6f5;
|
||||
}
|
||||
}
|
||||
.infoBox{
|
||||
color:#99a2af;
|
||||
}
|
||||
.sTil{
|
||||
color:#202d40;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
th.recordColumns{
|
||||
background-color: rgba(90, 117, 193, 0);
|
||||
.ant-table-column-title{
|
||||
font-family:PingFang SC;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color:#202d40;
|
||||
}
|
||||
}
|
||||
.ant-table-tbody > tr > td.recordColumns{
|
||||
color: #333;
|
||||
font-size: 15px;
|
||||
border-bottom: 1px dashed #e0e6f5;
|
||||
&.primaryColor{color: $primary-color;}
|
||||
}
|
||||
tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) td.recordColumns{
|
||||
background-color:#f8f9ff !important;
|
||||
}
|
||||
.statusBox{
|
||||
width:58px;
|
||||
height:32px;
|
||||
border-radius:4px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
&.errorBox{
|
||||
color:#ff0c0c;
|
||||
background-color:rgba(230, 0, 6, 0.1);
|
||||
border:1px solid #fcb6c2;;
|
||||
}
|
||||
&.accomplish{
|
||||
color:#009c44;
|
||||
background-color:rgba(83, 255, 163, 0.1);
|
||||
border:1px solid #00b843;;
|
||||
}
|
||||
}
|
||||
.primaryColor{color: $primary-color;}
|
||||
}
|
||||
.cancelBound{
|
||||
.ant-modal-header{
|
||||
padding: 10px 25px;
|
||||
background-color: #f8f8f8;
|
||||
.ant-modal-title{
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
font-weight: normal !important;
|
||||
}
|
||||
}
|
||||
.ant-modal-close{
|
||||
top: 0 !important;
|
||||
.ant-modal-close-x{font-size: 26px;}
|
||||
}
|
||||
.bTilModal{
|
||||
color:#333333;
|
||||
.errorRedSpan{
|
||||
display: inline-block;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
color: white;
|
||||
background-color:#ca0002;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.sTilModal{
|
||||
color:#666666;
|
||||
margin: 30px 0 40px 70px;
|
||||
}
|
||||
.ant-modal-footer{
|
||||
border-top: none;
|
||||
text-align: center;
|
||||
padding-bottom: 50px;
|
||||
.okBut, .okBut:focus{
|
||||
color:#df0002;
|
||||
border-color: #d9d9d9;
|
||||
margin-left: 43px;
|
||||
&:hover{
|
||||
border-color:#ff727c;
|
||||
}
|
||||
&:active{
|
||||
border-color:#f60011;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue