forked from Gitlink/forgeplus-react
代码库-样式
This commit is contained in:
parent
20f64bdf81
commit
3a1fd14e7c
|
@ -1,8 +1,8 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 2340181 */
|
||||
src: url('iconfont.woff2?t=1628649437297') format('woff2'),
|
||||
url('iconfont.woff?t=1628649437297') format('woff'),
|
||||
url('iconfont.ttf?t=1628649437297') format('truetype');
|
||||
src: url('iconfont.woff2?t=1628836445900') format('woff2'),
|
||||
url('iconfont.woff?t=1628836445900') format('woff'),
|
||||
url('iconfont.ttf?t=1628836445900') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
|
@ -13,6 +13,22 @@
|
|||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-xinjian2:before {
|
||||
content: "\e8b0";
|
||||
}
|
||||
|
||||
.icon-xieyiicon:before {
|
||||
content: "\e870";
|
||||
}
|
||||
|
||||
.icon-neicunicon:before {
|
||||
content: "\e891";
|
||||
}
|
||||
|
||||
.icon-zishuwenjian_icon:before {
|
||||
content: "\e8a6";
|
||||
}
|
||||
|
||||
.icon-dianzan_icon:before {
|
||||
content: "\e8ba";
|
||||
}
|
||||
|
@ -21,10 +37,6 @@
|
|||
content: "\e8bb";
|
||||
}
|
||||
|
||||
.icon-xieyiicon:before {
|
||||
content: "\e8a6";
|
||||
}
|
||||
|
||||
.icon-daimakuicon:before {
|
||||
content: "\e8a9";
|
||||
}
|
||||
|
@ -73,18 +85,10 @@
|
|||
content: "\e88e";
|
||||
}
|
||||
|
||||
.icon-neicunicon:before {
|
||||
content: "\e891";
|
||||
}
|
||||
|
||||
.icon-muluicon:before {
|
||||
content: "\e894";
|
||||
}
|
||||
|
||||
.icon-tianjia1:before {
|
||||
content: "\e896";
|
||||
}
|
||||
|
||||
.icon-a-shezhi:before {
|
||||
content: "\e899";
|
||||
}
|
||||
|
@ -109,10 +113,6 @@
|
|||
content: "\e8a4";
|
||||
}
|
||||
|
||||
.icon-zishuwenjian_icon:before {
|
||||
content: "\e8b0";
|
||||
}
|
||||
|
||||
.icon-zuohuaicon:before {
|
||||
content: "\e8b5";
|
||||
}
|
||||
|
@ -229,10 +229,6 @@
|
|||
content: "\e86f";
|
||||
}
|
||||
|
||||
.icon-daochu_xuanfu:before {
|
||||
content: "\e870";
|
||||
}
|
||||
|
||||
.icon-cuowu:before {
|
||||
content: "\e872";
|
||||
}
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -5,6 +5,34 @@
|
|||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "23572260",
|
||||
"name": "新建",
|
||||
"font_class": "xinjian2",
|
||||
"unicode": "e8b0",
|
||||
"unicode_decimal": 59568
|
||||
},
|
||||
{
|
||||
"icon_id": "23567674",
|
||||
"name": "协议icon",
|
||||
"font_class": "xieyiicon",
|
||||
"unicode": "e870",
|
||||
"unicode_decimal": 59504
|
||||
},
|
||||
{
|
||||
"icon_id": "23567675",
|
||||
"name": "内存icon",
|
||||
"font_class": "neicunicon",
|
||||
"unicode": "e891",
|
||||
"unicode_decimal": 59537
|
||||
},
|
||||
{
|
||||
"icon_id": "23567676",
|
||||
"name": "自述文件_icon",
|
||||
"font_class": "zishuwenjian_icon",
|
||||
"unicode": "e8a6",
|
||||
"unicode_decimal": 59558
|
||||
},
|
||||
{
|
||||
"icon_id": "23492900",
|
||||
"name": "点赞_icon",
|
||||
|
@ -19,13 +47,6 @@
|
|||
"unicode": "e8bb",
|
||||
"unicode_decimal": 59579
|
||||
},
|
||||
{
|
||||
"icon_id": "23473801",
|
||||
"name": "协议icon",
|
||||
"font_class": "xieyiicon",
|
||||
"unicode": "e8a6",
|
||||
"unicode_decimal": 59558
|
||||
},
|
||||
{
|
||||
"icon_id": "23473151",
|
||||
"name": "代码库icon",
|
||||
|
@ -110,13 +131,6 @@
|
|||
"unicode": "e88e",
|
||||
"unicode_decimal": 59534
|
||||
},
|
||||
{
|
||||
"icon_id": "23472264",
|
||||
"name": "内存icon",
|
||||
"font_class": "neicunicon",
|
||||
"unicode": "e891",
|
||||
"unicode_decimal": 59537
|
||||
},
|
||||
{
|
||||
"icon_id": "23472265",
|
||||
"name": "目录icon",
|
||||
|
@ -124,13 +138,6 @@
|
|||
"unicode": "e894",
|
||||
"unicode_decimal": 59540
|
||||
},
|
||||
{
|
||||
"icon_id": "23472266",
|
||||
"name": "添加",
|
||||
"font_class": "tianjia1",
|
||||
"unicode": "e896",
|
||||
"unicode_decimal": 59542
|
||||
},
|
||||
{
|
||||
"icon_id": "23472267",
|
||||
"name": "设 置",
|
||||
|
@ -173,13 +180,6 @@
|
|||
"unicode": "e8a4",
|
||||
"unicode_decimal": 59556
|
||||
},
|
||||
{
|
||||
"icon_id": "23472275",
|
||||
"name": "自述文件_icon",
|
||||
"font_class": "zishuwenjian_icon",
|
||||
"unicode": "e8b0",
|
||||
"unicode_decimal": 59568
|
||||
},
|
||||
{
|
||||
"icon_id": "23472276",
|
||||
"name": "左滑icon",
|
||||
|
@ -383,13 +383,6 @@
|
|||
"unicode": "e86f",
|
||||
"unicode_decimal": 59503
|
||||
},
|
||||
{
|
||||
"icon_id": "23046247",
|
||||
"name": "导出_悬浮",
|
||||
"font_class": "daochu_xuanfu",
|
||||
"unicode": "e870",
|
||||
"unicode_decimal": 59504
|
||||
},
|
||||
{
|
||||
"icon_id": "23046252",
|
||||
"name": "错误",
|
||||
|
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
@ -13,7 +13,7 @@ function CloneAddress({http_url , ssh_url , zip_url , tar_url}) {
|
|||
|
||||
return (
|
||||
<div className="downMenu">
|
||||
<div style={{padding:"10px 20px 20px 20px",borderBottom:"1px solid #eee"}}>
|
||||
<div style={{borderBottom:"1px solid #eee"}}>
|
||||
<Menu className="urlMenu" selectedKeys={[key]} mode={"horizontal"}>
|
||||
<Menu.Item key="HTTP" onClick={(e)=>{setKey(e.key)}}>HTTP</Menu.Item>
|
||||
<Menu.Item key="SSH" onClick={(e)=>{setKey(e.key)}}>SSH</Menu.Item>
|
||||
|
|
|
@ -48,7 +48,7 @@
|
|||
.branch-tagBox{
|
||||
border:1px solid #D0D0D0;
|
||||
border-radius: 3px;
|
||||
height: 40px;
|
||||
height: 36px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
@ -98,6 +98,7 @@
|
|||
.urlMenu{
|
||||
line-height: 30px;
|
||||
margin-bottom: 10px;
|
||||
padding:15px 20px 0px 20px;
|
||||
border-bottom: none;
|
||||
li.ant-menu-item{
|
||||
height: 30px;
|
||||
|
|
|
@ -113,7 +113,14 @@ li.ant-menu-item{
|
|||
z-index: 10000;
|
||||
}
|
||||
.laterest{
|
||||
color: #05690d;
|
||||
background-color: #EF3131;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
margin-left: 10px;
|
||||
padding:0px 5px;
|
||||
border-radius: 2px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1800px){
|
||||
|
@ -157,39 +164,88 @@ li.ant-menu-item{
|
|||
}
|
||||
|
||||
.menuPanels{
|
||||
width: 240px;
|
||||
height: 180px;
|
||||
width: 295px;
|
||||
.leftline{
|
||||
position: relative;
|
||||
color: #666;
|
||||
height: 16px;
|
||||
&::before{
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top:3px;
|
||||
height: 12px;
|
||||
width: 1px;
|
||||
background-color: #666666;
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
.ant-btn{
|
||||
height: 36px;
|
||||
line-height: 34px;
|
||||
width: 83px;
|
||||
text-align: center;
|
||||
padding:0px ;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
&.currentBtn{
|
||||
cursor: default;
|
||||
color: #333;
|
||||
&:hover{
|
||||
color: #333;
|
||||
border-color: #d0d0d0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ant-btn-default{
|
||||
color: #333;
|
||||
border-color: #d0d0d0;
|
||||
&:hover{
|
||||
background: #F3F4F6;
|
||||
}
|
||||
}
|
||||
.ant-btn-primary{
|
||||
color: #fff;
|
||||
background-color: #2A61FF;
|
||||
}
|
||||
.focusPanelHeadInfo{
|
||||
padding:14px 16px;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
.ant-popover-content,.ant-popover-inner{
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.ant-popover-inner-content{
|
||||
padding:0px;
|
||||
}
|
||||
}
|
||||
.halfs{
|
||||
margin-top: 24px;
|
||||
padding:24px 0px 0px 0px;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
.attrPerson{
|
||||
padding-bottom: 24px;
|
||||
}
|
||||
.aboutSubTitle{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.menuinfos{
|
||||
padding:15px 0px;
|
||||
padding:10px 20px;
|
||||
&>a{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
border-right: 1px solid #eee;
|
||||
flex: 1;
|
||||
& >span:first-child{
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
line-height: 22px;
|
||||
}
|
||||
& >span:last-child{
|
||||
color: #666;
|
||||
}
|
||||
&:last-child{
|
||||
border-right: none;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { AlignCenter , FlexAJ } from '../Component/layout';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Popover , Spin } from 'antd';
|
||||
import { Popover , Spin , Button } from 'antd';
|
||||
import { getImageUrl } from 'educoder';
|
||||
import './Component.scss';
|
||||
import { getUser } from '../GetData/getData';
|
||||
import axios from 'axios';
|
||||
|
||||
function Contributors({contributors,owner,projectsId}){
|
||||
function Contributors({contributors,owner,projectsId,currentLogin}){
|
||||
const [ menuList ,setMenuList ]= useState([]);
|
||||
const [ list , setList ]= useState(undefined);
|
||||
const [ total , setTotal ]= useState(0);
|
||||
|
@ -50,15 +50,28 @@ function Contributors({contributors,owner,projectsId}){
|
|||
if(data){
|
||||
let ele = (
|
||||
<Spin spinning={isSpin}>
|
||||
<FlexAJ>
|
||||
<AlignCenter>
|
||||
<AlignCenter className="focusPanelHeadInfo">
|
||||
<Link to={`/users/${data.login}`}><img src={getImageUrl(`/${data.image_url}`)} alt="" className="radius" width="38px" height="38px"/></Link>
|
||||
<Link to={`/users/${data.login}`} className="ml10">{data.name}</Link>
|
||||
<div className="flex1 ml10" style={{width:"0"}}>
|
||||
<AlignCenter>
|
||||
<Link to={`/users/${data.login}`} className="font-16">{data.name}</Link>
|
||||
{
|
||||
data.location &&
|
||||
<span className="ml20 font-12 leftline">{data.location}</span>
|
||||
}
|
||||
</AlignCenter>
|
||||
{
|
||||
data.is_watch ? <a className="color-grey-9" onClick={()=>FocusFunc(false,data.login)}>取消关注</a>:<a className="color-blue" onClick={()=>FocusFunc(true,data.login)}>关注</a>
|
||||
data.organizations && data.organizations.length > 0 ?
|
||||
<AlignCenter className="font-12 mt5">
|
||||
<span>所属组织:</span>
|
||||
<div className="task-hide flex1">
|
||||
{renderArray(data.organizations)}
|
||||
</div>
|
||||
</AlignCenter>
|
||||
:""
|
||||
}
|
||||
</FlexAJ>
|
||||
</div>
|
||||
</AlignCenter>
|
||||
<AlignCenter className="menuinfos">
|
||||
<a href={data.projects_url}>
|
||||
<span>{data.projects_count}</span>
|
||||
|
@ -73,19 +86,18 @@ function Contributors({contributors,owner,projectsId}){
|
|||
<span>关注数</span>
|
||||
</a>
|
||||
</AlignCenter>
|
||||
<div className={"pb20"} style={{display:"flex",justifyContent:'center'}}>
|
||||
{
|
||||
data.organizations && data.organizations.length > 0 ?
|
||||
<AlignCenter className="font-12 pt4 pb4">
|
||||
<span>所属组织:</span>
|
||||
<div className="task-hide flex1">
|
||||
{renderArray(data.organizations)}
|
||||
currentLogin && (currentLogin === data.login)
|
||||
?
|
||||
<Button className="currentBtn">当前用户</Button>
|
||||
:
|
||||
data.is_watch ?
|
||||
<Button type={"default"} onClick={()=>FocusFunc(false,data.login)}>已关注</Button>
|
||||
:
|
||||
<Button type={"primary"} onClick={()=>FocusFunc(true,data.login)}>关注TA</Button>
|
||||
}
|
||||
</div>
|
||||
</AlignCenter>
|
||||
:""
|
||||
}
|
||||
{
|
||||
data.location && <AlignCenter className="font-12 pt4 pb4"><span>所在地址:</span><span className="ml5">{data.location}</span></AlignCenter>
|
||||
}
|
||||
</Spin>
|
||||
)
|
||||
setMenu(ele);
|
||||
|
@ -135,12 +147,10 @@ function Contributors({contributors,owner,projectsId}){
|
|||
|
||||
return(
|
||||
<div className="halfs">
|
||||
<FlexAJ>
|
||||
<AlignCenter>
|
||||
<Link to={`/projects/${owner}/${projectsId}/contribute`} className="font-16 color-ooo">贡献者</Link>
|
||||
<Link to={`/projects/${owner}/${projectsId}/contribute`} className="font-16 color-ooo aboutSubTitle">
|
||||
<span>贡献者</span>
|
||||
{ contributors && contributors.total_count > 0 && <span className="infoCount">{contributors.total_count}</span>}
|
||||
</AlignCenter>
|
||||
</FlexAJ>
|
||||
</Link>
|
||||
<div className="attrPerson" onMouseLeave={()=>setVisibleFunc(false)}>
|
||||
{
|
||||
total > 0 ?
|
||||
|
|
|
@ -25,7 +25,7 @@ function LanguagePower({languages}){
|
|||
}
|
||||
return(
|
||||
<div>
|
||||
<p className="font-16 color-grey-6">开发语言</p>
|
||||
<p className="font-16 color-ooo aboutSubTitle">开发语言</p>
|
||||
<div className="progress">
|
||||
{
|
||||
array && array.map((item,key)=>{
|
||||
|
|
|
@ -6,26 +6,21 @@ function Releases({owner,projectsId,releaseVersions , baseOperate , projectType}
|
|||
|
||||
return(
|
||||
<div>
|
||||
<FlexAJ>
|
||||
<AlignCenter><Link to={`/projects/${owner}/${projectsId}/releases`} className="font-16 color-ooo">发行版</Link>
|
||||
<Link to={`/projects/${owner}/${projectsId}/releases`} className="font-16 color-ooo aboutSubTitle">
|
||||
<span>发行版</span>
|
||||
{ releaseVersions && releaseVersions.total_count > 0 && <span className="infoCount">{releaseVersions.total_count}</span>}
|
||||
</AlignCenter>
|
||||
{/* {
|
||||
baseOperate && projectType !==2 && <Link className="font-12 color-blue" to={`/projects/${owner}/${projectsId}/releases/new`}>新建</Link>
|
||||
} */}
|
||||
</FlexAJ>
|
||||
</Link>
|
||||
{
|
||||
releaseVersions && releaseVersions.total_count>0 ?
|
||||
releaseVersions.list.map((item,key)=>{
|
||||
return(
|
||||
key === 0 &&<AlignTop className="mt10">
|
||||
<i className="iconfont icon-biaoqian3 color-grey-6 font-18 mr10"></i>
|
||||
<div>
|
||||
<p className="font-16 color-grey-6">
|
||||
<Link to={`/projects/${owner}/${projectsId}/releases`}>{item.name}</Link>
|
||||
<span className="font-12 laterest ml5">最新</span>
|
||||
<p className="font-16">
|
||||
<Link to={`/projects/${owner}/${projectsId}/releases`} className="color-grey-3">发布{item.name}版本</Link>
|
||||
<span className="laterest">最新</span>
|
||||
</p>
|
||||
<p className="color-grey-9 font-13">{item.created_at}</p>
|
||||
<p className="color-grey-3 font-12">{item.created_at}</p>
|
||||
</div>
|
||||
</AlignTop>
|
||||
)
|
||||
|
|
|
@ -315,7 +315,7 @@ function CoderDepot(props){
|
|||
list = {mainFlag ? dirInfo : undefined}
|
||||
/>
|
||||
<div className="drawerBtn" onClick={()=>setVisible(true)}>
|
||||
<i className="iconfont icon-youjiantou font-16"></i>
|
||||
<i className="iconfont icon-zuohuaicon font-14"></i>
|
||||
<span>目录</span>
|
||||
</div>
|
||||
</React.Fragment>
|
||||
|
@ -328,7 +328,7 @@ function CoderDepot(props){
|
|||
<div className="panelmenu">
|
||||
<FlexAJ>
|
||||
<AlignCenter>
|
||||
<div className="mr20">
|
||||
<div className="mr30">
|
||||
{
|
||||
props && props.platform ?
|
||||
<SelectBranch
|
||||
|
@ -359,23 +359,23 @@ function CoderDepot(props){
|
|||
</Link>
|
||||
</AlignCenter>
|
||||
</AlignCenter>
|
||||
<AlignCenter>
|
||||
<AlignCenter className="depotBtn">
|
||||
{
|
||||
baseOperate && projectDetail.type !== 2 && pullsFlag &&
|
||||
<Button onClick={()=>urlLink(`/projects/${owner}/${projectsId}/pulls/new`)} className="mr10">+ 合并请求</Button>
|
||||
<Button type="default" onClick={()=>urlLink(`/projects/${owner}/${projectsId}/pulls/new`)} className="mr10"><i className="iconfont icon-xinjian2 font-12 mr3"></i> 合并请求</Button>
|
||||
}
|
||||
{
|
||||
baseOperate && issuesFlag &&
|
||||
<Button onClick={()=>urlLink(`/projects/${owner}/${projectsId}/issues/new`)} className="mr10">+ 任务</Button>
|
||||
<Button type="default" onClick={()=>urlLink(`/projects/${owner}/${projectsId}/issues/new`)} className="mr10"><i className="iconfont icon-xinjian2 font-12 mr3"></i> 任务</Button>
|
||||
}
|
||||
{ fileOperate &&
|
||||
<Dropdown overlay={fileMenu()} className="mr10" trigger={['click']}>
|
||||
<Button type="default">文件 <i className="iconfont icon-sanjiaoxing-down ml3 font-14 color-grey-9"></i></Button>
|
||||
<Button type="default">文件 <i className="iconfont icon-sanjiaoxing-down ml3 font-14 color-grey-6 mr-5"></i></Button>
|
||||
</Dropdown>
|
||||
}
|
||||
|
||||
<Dropdown overlay={downloadMenu} placement="bottomRight" trigger={['click']}>
|
||||
<Button type={'primary'}>下载 <i className="iconfont icon-sanjiaoxing-down ml3 font-14 color-white"></i></Button>
|
||||
<Button type={'primary'}>下载 <i className="iconfont icon-sanjiaoxing-down ml3 font-14 color-white mr-3"></i></Button>
|
||||
</Dropdown>
|
||||
</AlignCenter>
|
||||
</FlexAJ>
|
||||
|
@ -391,11 +391,11 @@ function CoderDepot(props){
|
|||
</div>
|
||||
{ hideBtn && <span className="ellipsis" onClick={()=>changeHide(hide)}><i className="iconfont icon-shenglvehao"></i></span> }
|
||||
|
||||
<span className="ml12 color-grey-9 mt1">{lastCommit && lastCommit.time_from_now}</span>
|
||||
<span className="ml20 color-grey-9 mt1">{lastCommit && lastCommit.time_from_now}</span>
|
||||
{
|
||||
commitCount ?
|
||||
<Link to={`/projects/${owner}/${projectsId}/commits/branch/${turnbar(branchName || defaultBranch)}`} className="ml12 color-grey-9" style={{height:"30px",lineHeight:"30px"}}>
|
||||
<i className="iconfont icon-tijiao mr3 font-17"></i>{commitCount}次提交
|
||||
<Link to={`/projects/${owner}/${projectsId}/commits/branch/${turnbar(branchName || defaultBranch)}`} className="ml20 color-grey-9" style={{height:"30px",lineHeight:"30px"}}>
|
||||
<i className="iconfont icon-tijiaoicon mr3 font-16"></i>{commitCount}次提交
|
||||
</Link>:""
|
||||
}
|
||||
</div>
|
||||
|
@ -452,12 +452,12 @@ function CoderDepot(props){
|
|||
<ShortWidth>
|
||||
<Gap style={{paddingLeft:"30px"}}>
|
||||
<div className="panelmenu">
|
||||
<FlexAJ className="font-18 color-grey-6 mb20" style={{lineHeight:"28px"}}>简介
|
||||
<FlexAJ className="font-16 color-ooo mb10" style={{lineHeight:"22px"}}>关于
|
||||
{projectDetail.permission && (projectDetail.permission==="Admin" || projectDetail.permission==="Owner") &&
|
||||
<a className="color-grey-6" href="javascript:void(0)"><i onClick={()=>setOpenModal(true)} className="iconfont icon-a-shezhi font-15"></i></a>
|
||||
}
|
||||
</FlexAJ>
|
||||
{desc && <p className="font-14 color-grey-9 mb15 task-hide-2" style={{lineHeight:"22px",WebkitLineClamp:"4",textAlign:"justify",wordBreak:"break-all"}}>{desc}</p>}
|
||||
{desc && <p className="font-14 color-grey-3 mb15 task-hide-2" style={{lineHeight:"24px",WebkitLineClamp:"4",textAlign:"justify",wordBreak:"break-all"}}>{desc}</p>}
|
||||
{
|
||||
website &&
|
||||
<div className="color-grey-6 df pinfos mb5">
|
||||
|
@ -466,7 +466,7 @@ function CoderDepot(props){
|
|||
</div>
|
||||
}
|
||||
<div className="pinfos mb5">
|
||||
<i className="iconfont icon-wenjian4 font-15 mr10"></i>
|
||||
<i className="iconfont icon-zishuwenjian_icon font-15 mr10"></i>
|
||||
<a href="#readme">README.md</a>
|
||||
</div>
|
||||
<div className="color-grey-6 mb5">
|
||||
|
@ -476,7 +476,7 @@ function CoderDepot(props){
|
|||
{
|
||||
projectDetail && projectDetail.license_name &&
|
||||
<div>
|
||||
<i className="iconfont icon-tianping font-16 mr10 color-grey-3"></i>
|
||||
<i className="iconfont icon-xieyiicon font-16 mr10 color-grey-6"></i>
|
||||
<span className="color-grey-6">{projectDetail.license_name}</span>
|
||||
</div>
|
||||
}
|
||||
|
@ -492,7 +492,7 @@ function CoderDepot(props){
|
|||
lesson_url &&
|
||||
<div>
|
||||
<Divider />
|
||||
<p className="font-16 color-grey-6">实践课程</p>
|
||||
<p className="font-16 color-ooo">实践课程</p>
|
||||
<a href={lesson_url} target="_blank" className="color-grey-6" style={{textDecoration:"underline",wordBreak:"break-all"}}>{lesson_url}</a>
|
||||
</div>
|
||||
}
|
||||
|
@ -514,7 +514,12 @@ function CoderDepot(props){
|
|||
{/* 贡献者 */}
|
||||
{
|
||||
projectDetail && projectDetail.contributors &&
|
||||
<Contributors contributors={projectDetail && projectDetail.contributors} owner={owner} projectsId={projectsId} />
|
||||
<Contributors
|
||||
contributors={projectDetail && projectDetail.contributors}
|
||||
owner={owner}
|
||||
projectsId={projectsId}
|
||||
currentLogin={current_user && current_user.login}
|
||||
/>
|
||||
}
|
||||
{/* 语言 */}
|
||||
{ projectDetail && projectDetail.languages &&
|
||||
|
|
|
@ -13,7 +13,7 @@ function CoderDepotCatalogue({item , goToSubRoot , owner , projectsId }){
|
|||
<li>
|
||||
<span>
|
||||
<a onClick={()=>goToSubRoot(item.path,item.type,item.name)} className={item.type === "submodule" && "submoduleStyle"}>
|
||||
<i className={`iconfont ${typeIco[`${item.type}`]} color-blue-file mr5`}></i>{item.name}
|
||||
<i className={`iconfont ${typeIco[`${item.type}`]} color-blue-file mr8`}></i>{item.name}
|
||||
</a>
|
||||
</span>
|
||||
<span title="init project">
|
||||
|
|
|
@ -1,8 +1,7 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import RenderHtml from '../../components/render-html';
|
||||
import { AlignCenter } from '../Component/layout';
|
||||
import { Dropdown , Menu , Spin } from 'antd';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Dropdown , Anchor , Spin } from 'antd';
|
||||
|
||||
import ReadmeCatelogue from './sub/ReadmeCatelogue';
|
||||
const $ = window.$;
|
||||
|
@ -33,17 +32,19 @@ function CoderDepotReadme({ operate , history , readme , ChangeFile }){
|
|||
function menu(){
|
||||
if(menuList && menuList.length > 0){
|
||||
return(
|
||||
<ReadmeCatelogue menuList={menuList}/>
|
||||
<ReadmeCatelogue menuList={menuList} hash={history.location.hash}/>
|
||||
)
|
||||
}else{
|
||||
return <Spin />
|
||||
}
|
||||
}
|
||||
|
||||
return(
|
||||
<div className="commonBox readBox" id="readme">
|
||||
<Anchor offsetTop={70} targetOffset={160}>
|
||||
<div className="commonBox-title boxTitle">
|
||||
<AlignCenter>
|
||||
<Dropdown overlay={menu()} trigger={['click']} overlayClassName="menuslist">
|
||||
<Dropdown overlay={menu()} trigger={['hover']} overlayClassName="menuslist">
|
||||
<span className="catelogue">
|
||||
<i className="iconfont icon-muluicon font-12 mr5"></i>
|
||||
<span>目录</span>
|
||||
|
@ -59,6 +60,7 @@ function CoderDepotReadme({ operate , history , readme , ChangeFile }){
|
|||
:""
|
||||
}
|
||||
</div>
|
||||
</Anchor>
|
||||
{
|
||||
content &&
|
||||
<div className="commonBox-info">
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import React, { Component } from 'react';
|
||||
import { Spin, Tooltip, Button } from 'antd';
|
||||
import { Link, Route, Switch } from 'react-router-dom';
|
||||
import { Content , AlignTop } from '../Component/layout';
|
||||
import { Content , AlignTop, AlignCenter } from '../Component/layout';
|
||||
import DetailBanner from './sub/DetailBanner';
|
||||
import { numFormat } from 'educoder';
|
||||
import '../css/index.scss'
|
||||
|
@ -435,31 +435,19 @@ class Detail extends Component {
|
|||
<div>
|
||||
<div className="detailHeader-wrapper">
|
||||
<div className="normal">
|
||||
<AlignTop style={{padding:"25px 0px 10px",justifyContent:"space-between"}}>
|
||||
<div>
|
||||
<AlignCenter style={{paddingTop:"20px",justifyContent:"space-between"}}>
|
||||
|
||||
<AlignTop>
|
||||
<div className="projectallName">
|
||||
{project && project.author &&
|
||||
<Link to={`${project.author.type ==="Organization" ? "/organize":'/users'}/${project.author.login}`}>{project.author.name}</Link>
|
||||
<Link to={`${project.author.type ==="Organization" ? "/organize":'/users'}/${project.author.login}`} title={project.author.name}>{project.author.name}</Link>
|
||||
}
|
||||
<span className="ml5 mr5">/</span>
|
||||
<Link to={`/projects/${owner}/${projectsId}`} className="projectN mt6">{projectDetail && projectDetail.name}</Link>
|
||||
<Link to={`/projects/${owner}/${projectsId}`} className="projectN" title={projectDetail && projectDetail.name}>{projectDetail && projectDetail.name}</Link>
|
||||
</div>
|
||||
{ projectDetail && projectDetail.private && <span className="privateTag mt6">私有</span>}
|
||||
{ projectDetail && projectDetail.private && <span className="privateTag">私有</span>}
|
||||
</AlignTop>
|
||||
<div className="mt8">
|
||||
{
|
||||
projectDetail && projectDetail.forked_from_project_id && projectDetail.fork_info ?
|
||||
this.textFunc(projectDetail.forked_from_project_id,projectDetail.fork_info)
|
||||
:""
|
||||
}
|
||||
{
|
||||
projectDetail && projectDetail.type && projectDetail.type !== 0 ?
|
||||
<span className="color-grey-9">镜像自 <a className="color-blue hoverLine" target="_blank" href={projectDetail.mirror_url}>{projectDetail.mirror_url}</a></span>
|
||||
:""
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
{
|
||||
firstSync ? "":
|
||||
|
@ -502,7 +490,8 @@ class Detail extends Component {
|
|||
<span className="detail_tag_btn" loading={forkSpin}>
|
||||
<Tooltip title="复刻是fork的中文名,即复制代码仓库" placement="bottom">
|
||||
<a className="detail_tag_btn_name" style={{cursor:platform?"pointer":"default"}} onClick={this.forkFunc}>
|
||||
<i className="iconfont icon-fork color-grey-9 mr3 font-16"></i>复刻
|
||||
<i className="iconfont icon-fork color-grey-9 mr3 font-16"></i>
|
||||
<span>复刻</span>
|
||||
</a>
|
||||
</Tooltip>
|
||||
{
|
||||
|
@ -519,7 +508,19 @@ class Detail extends Component {
|
|||
</span>
|
||||
}
|
||||
</div>
|
||||
</AlignTop>
|
||||
</AlignCenter>
|
||||
<div className="mt6" style={{minHeight:"20px"}}>
|
||||
{
|
||||
projectDetail && projectDetail.forked_from_project_id && projectDetail.fork_info ?
|
||||
this.textFunc(projectDetail.forked_from_project_id,projectDetail.fork_info)
|
||||
:""
|
||||
}
|
||||
{
|
||||
projectDetail && projectDetail.type && projectDetail.type !== 0 ?
|
||||
<span className="color-grey-9">镜像自 <a className="color-blue hoverLine" target="_blank" href={projectDetail.mirror_url}>{projectDetail.mirror_url}</a></span>
|
||||
:""
|
||||
}
|
||||
</div>
|
||||
{
|
||||
firstSync ? "" :
|
||||
<DetailBanner
|
||||
|
|
|
@ -108,6 +108,31 @@
|
|||
margin: 0 auto;
|
||||
.panelmenu{
|
||||
padding-top:30px;
|
||||
.depotBtn{
|
||||
.mr-5{
|
||||
margin-right: -5px;
|
||||
}
|
||||
.ant-btn{
|
||||
height: 36px;
|
||||
line-height: 34px;
|
||||
width: 83px;
|
||||
text-align: center;
|
||||
padding:0px ;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
}
|
||||
.ant-btn-default{
|
||||
color: #333;
|
||||
border-color: #d0d0d0;
|
||||
&:hover{
|
||||
background: #F3F4F6;
|
||||
}
|
||||
}
|
||||
.ant-btn-primary{
|
||||
color: #fff;
|
||||
background-color: #2A61FF;
|
||||
}
|
||||
}
|
||||
}
|
||||
.addOptionBtn{
|
||||
height: 32px;
|
||||
|
@ -140,15 +165,16 @@
|
|||
font-size: 12px;
|
||||
}
|
||||
.attrPerson{
|
||||
padding-top: 15px;
|
||||
padding-top: 12px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding-bottom: 2px;
|
||||
a{
|
||||
margin: 10px 10px 0px 0px;
|
||||
margin: 0px 17px 0px 0px;
|
||||
img{
|
||||
border-radius: 50%;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
&:nth-child(6){
|
||||
margin-right: 0px;
|
||||
|
@ -185,10 +211,11 @@
|
|||
padding-left: 15px;
|
||||
position: relative;
|
||||
min-width: 33.5%;
|
||||
span{
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #666;
|
||||
span{
|
||||
&:last-child{
|
||||
color: #999;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
@ -300,8 +327,10 @@
|
|||
.drawerBtn{
|
||||
position: fixed;
|
||||
left: -13px;
|
||||
border:1px solid rgb(207,205,223);
|
||||
width: 34px;
|
||||
width: 33px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.09);
|
||||
border: 1px solid #666666;
|
||||
border-radius: 0px 12px 12px 0px;
|
||||
height: 70px;
|
||||
top:50%;
|
||||
|
@ -309,29 +338,35 @@
|
|||
cursor: pointer;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-left: 7px;
|
||||
&:hover{
|
||||
box-shadow: 1px 0px 7px rgba(0,0,0,0.1);
|
||||
box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.09);
|
||||
}
|
||||
span{
|
||||
writing-mode: vertical-lr;
|
||||
color: #202429;
|
||||
color: #333;
|
||||
width: 25px;
|
||||
font-size: 14px;
|
||||
}
|
||||
i{
|
||||
color: #24292e;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
width: 18px;
|
||||
color: #333;
|
||||
height: 14px;
|
||||
line-height: 14px;
|
||||
width: 14px;
|
||||
margin-left: 2px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
}
|
||||
.downMenu{
|
||||
width: 330px;
|
||||
box-shadow: 0px 0px 9px rgba(134, 134, 134,0.4);
|
||||
width: 329px;
|
||||
background-color: #fff;
|
||||
.ant-menu-vertical .ant-menu-item:hover{
|
||||
background-color: #e6f7ff;
|
||||
box-shadow: 0px 1px 8px 1px rgba(212, 212, 212, 0.5);
|
||||
padding-bottom: 14px;
|
||||
.ant-menu-item{
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -379,3 +414,9 @@
|
|||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
.ant-anchor-wrapper{
|
||||
padding-left: 2px;
|
||||
.ant-anchor-ink::before{
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
|
@ -220,27 +220,24 @@
|
|||
.detailHeader-wrapper{
|
||||
background-color:#FBFCFF;
|
||||
border-bottom:1px solid #e2e2e2;
|
||||
/* box-shadow: 0px 2px 11px 0px#D0D0D0; */
|
||||
}
|
||||
.headerMenu-wrapper{
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.headerMenu-wrapper li{
|
||||
cursor: pointer;
|
||||
li{
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
height: 40px;
|
||||
line-height: 28px;
|
||||
padding:0px 20px;
|
||||
}
|
||||
.headerMenu-wrapper li a{
|
||||
& > a{
|
||||
color: #666;
|
||||
}
|
||||
.headerMenu-wrapper li a > img{
|
||||
&> img{
|
||||
margin-right: 8px;
|
||||
}
|
||||
.headerMenu-wrapper li a > span.num{
|
||||
&> span.num{
|
||||
line-height: 24px;
|
||||
margin-left: 5px;
|
||||
margin-top: 2px;
|
||||
|
@ -252,10 +249,11 @@
|
|||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
.headerMenu-wrapper li.active a,.headerMenu-wrapper li.active a i{
|
||||
}
|
||||
&.active a,&.active a i{
|
||||
color: #2A61FF!important;
|
||||
}
|
||||
.headerMenu-wrapper li.active::after{
|
||||
&.active::after,&:hover::after{
|
||||
position: absolute;
|
||||
bottom:0px;
|
||||
height:2px;
|
||||
|
@ -264,6 +262,11 @@
|
|||
left: 0px;
|
||||
width:100%;
|
||||
}
|
||||
&:hover::after{
|
||||
background-color: rgba(153, 153, 153, 0.2);;
|
||||
}
|
||||
}
|
||||
}
|
||||
.detail_tag_btn{
|
||||
height:34px;
|
||||
line-height: 32px;
|
||||
|
@ -271,24 +274,24 @@
|
|||
border:1px solid #D0D0D0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 30px;
|
||||
margin-left: 10px;
|
||||
padding:0px;
|
||||
background-color:#FAFBFC;
|
||||
box-shadow: none;
|
||||
}
|
||||
.detail_tag_btn:hover{
|
||||
&:hover{
|
||||
background-color: #F3F4F6;
|
||||
}
|
||||
.ant-tooltip {
|
||||
max-width: fit-content!important;
|
||||
}
|
||||
.detail_tag_btn_name{
|
||||
padding:0px 10px;
|
||||
color: #666!important;
|
||||
padding:0px 18px;
|
||||
min-width: 82px;
|
||||
text-align: center;
|
||||
&:hover>span{
|
||||
color: #333!important;
|
||||
}
|
||||
.detail_tag_btn_name img{
|
||||
img{
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.detail_tag_btn_count{
|
||||
width: 42px;
|
||||
text-align: center;
|
||||
|
@ -297,6 +300,10 @@
|
|||
height:100%;
|
||||
border-left: 1px solid #D0D0D0;
|
||||
}
|
||||
}
|
||||
.ant-tooltip {
|
||||
max-width: fit-content!important;
|
||||
}
|
||||
.files-md{
|
||||
padding:20px;
|
||||
}
|
||||
|
@ -347,6 +354,7 @@
|
|||
|
||||
|
||||
.gitAddressClone{
|
||||
margin:0px 20px 14px 20px!important;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
align-items: center;
|
||||
|
@ -658,9 +666,7 @@
|
|||
.item:last-child{
|
||||
border-bottom:none;
|
||||
}
|
||||
.gitAddressClone{
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.item_title small{
|
||||
font-weight: 400;
|
||||
margin-left: 10px;
|
||||
|
|
|
@ -18,7 +18,7 @@ function DetailBanner({ history,list , owner , projectsId , isManager , url , pa
|
|||
}
|
||||
},[list]);
|
||||
return(
|
||||
<div className="f-wrap-between mt15">
|
||||
<div className="f-wrap-between mt25">
|
||||
{
|
||||
menuName && projectDetail ?
|
||||
<ul className="headerMenu-wrapper">
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
import React , {useState } from 'react';
|
||||
import React , { useState , useEffect } from 'react';
|
||||
import { Anchor , Input } from 'antd';
|
||||
import './sub.scss';
|
||||
import { Base64 } from 'js-base64';
|
||||
|
||||
const { Link } = Anchor;
|
||||
const { Search } = Input;
|
||||
|
||||
function ReadmeCatelogue({ menuList }) {
|
||||
function ReadmeCatelogue({ menuList , hash }) {
|
||||
const [ goHref , setGoHref ] = useState("");
|
||||
const [ value , setValue ] = useState("");
|
||||
const [ menu , setMenu] = useState(menuList);
|
||||
|
@ -18,7 +18,7 @@ function ReadmeCatelogue({ menuList }) {
|
|||
function changeValue(e) {
|
||||
setValue(e.target.value);
|
||||
if(e.target.value){
|
||||
let m = menu.filter(i=>i.text.indexOf(e.target.value)>-1);
|
||||
let m = menuList.filter(i=>i.text.indexOf(e.target.value)>-1);
|
||||
setMenu(m);
|
||||
}else{
|
||||
setMenu(menuList);
|
||||
|
@ -41,7 +41,7 @@ function ReadmeCatelogue({ menuList }) {
|
|||
menu.map((item,key)=>{
|
||||
return(
|
||||
<div style={{paddingLeft:`${item.level *10}px`}} className={goHref===item.href?"items active":"items"}>
|
||||
<Link href={`${item.href}`} title={item.text} />
|
||||
<Link href={`#${item.text}`} title={item.text} />
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
|
|
@ -34,13 +34,10 @@
|
|||
padding:15px;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
.anchorBox{
|
||||
max-height: 255px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.ant-anchor-wrapper{
|
||||
margin-left: 0px;
|
||||
padding:5px 15px;
|
||||
max-height: 255px!important;
|
||||
.items{
|
||||
border-radius: 4px;
|
||||
margin-bottom: 5px;
|
||||
|
|
|
@ -11,7 +11,7 @@ ul,ol,dl{
|
|||
font-size: 22px;
|
||||
font-weight: normal;
|
||||
line-height: 30px;
|
||||
max-width: 700px;
|
||||
max-width: 690px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
|
Loading…
Reference in New Issue