Gitlink
/
forgeplus-react
39
0
Fork 30
Code Issues Pull Requests Releases 1 Wiki Activity

代码库-样式

This commit is contained in:
caishi 2021-08-13 17:12:56 +08:00 committed by caishi
parent 984856a29c
commit 37f608cdb8
16 changed files with 268 additions and 155 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/forge/Branch/CloneAddress.js
View File

@ -7,7 +7,7 @@ function CloneAddress({http_url , ssh_url , zip_url , tar_url}) {
const [ key , setKey ] = useState("HTTP"); const [ key , setKey ] = useState("HTTP");
return ( return (
<div className="downMenu"> <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 className="urlMenu" selectedKeys={[key]} mode={"horizontal"}>
<Menu.Item key="HTTP" onClick={(e)=>{setKey(e.key)}}>HTTP</Menu.Item> <Menu.Item key="HTTP" onClick={(e)=>{setKey(e.key)}}>HTTP</Menu.Item>
<Menu.Item key="SSH" onClick={(e)=>{setKey(e.key)}}>SSH</Menu.Item> <Menu.Item key="SSH" onClick={(e)=>{setKey(e.key)}}>SSH</Menu.Item>

3
src/forge/Branch/branch.scss
View File

@ -48,7 +48,7 @@
.branch-tagBox{ .branch-tagBox{
border:1px solid #D0D0D0; border:1px solid #D0D0D0;
border-radius: 3px; border-radius: 3px;
height: 40px; height: 36px;
display: flex; display: flex;
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
@ -98,6 +98,7 @@
.urlMenu{ .urlMenu{
line-height: 30px; line-height: 30px;
margin-bottom: 10px; margin-bottom: 10px;
padding:15px 20px 0px 20px;
border-bottom: none; border-bottom: none;
li.ant-menu-item{ li.ant-menu-item{
height: 30px; height: 30px;

82
src/forge/Component/Component.scss
View File

@ -113,7 +113,14 @@ li.ant-menu-item{
z-index: 10000; z-index: 10000;
} }
.laterest{ .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){ @media screen and (max-width: 1800px){
@ -157,39 +164,88 @@ li.ant-menu-item{
} }
.menuPanels{ .menuPanels{
width: 240px; width: 295px;
height: 180px; .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{ .ant-popover-content,.ant-popover-inner{
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
.ant-popover-inner-content{
padding:0px;
}
} }
.halfs{ .halfs{
margin-top: 24px; margin-top: 24px;
padding:24px 0px 0px 0px; padding:24px 0px 0px 0px;
border-top: 1px solid #e8e8e8; border-top: 1px solid #e8e8e8;
.attrPerson{ }
padding-bottom: 24px; .aboutSubTitle{
} display: flex;
align-items: center;
} }
.menuinfos{ .menuinfos{
padding:15px 0px; padding:10px 20px;
&>a{ &>a{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
border-right: 1px solid #eee;
flex: 1; flex: 1;
& >span:first-child{ & >span:first-child{
font-size: 18px; font-size: 16px;
font-weight: 400; font-weight: 500;
color: #333; color: #333;
line-height: 22px;
} }
& >span:last-child{ & >span:last-child{
color: #666; color: #666;
} font-weight: 400;
&:last-child{ line-height: 20px;
border-right: none; margin-top: 6px;
} }
} }
} }

29
src/forge/Component/Contributors.jsx
View File

@ -1,13 +1,13 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { AlignCenter , FlexAJ } from '../Component/layout'; import { AlignCenter , FlexAJ } from '../Component/layout';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { Popover , Spin } from 'antd'; import { Popover , Spin , Button } from 'antd';
import { getImageUrl } from 'educoder'; import { getImageUrl } from 'educoder';
import './Component.scss'; import './Component.scss';
import { getUser } from '../GetData/getData'; import { getUser } from '../GetData/getData';
import axios from 'axios'; import axios from 'axios';
function Contributors({contributors,owner,projectsId}){ function Contributors({contributors,owner,projectsId,currentLogin}){
const [ menuList ,setMenuList ]= useState([]); const [ menuList ,setMenuList ]= useState([]);
const [ list , setList ]= useState(undefined); const [ list , setList ]= useState(undefined);
const [ total , setTotal ]= useState(0); const [ total , setTotal ]= useState(0);
@ -73,19 +73,18 @@ function Contributors({contributors,owner,projectsId}){
<span>关注数</span> <span>关注数</span>
</a> </a>
</AlignCenter> </AlignCenter>
{ <div className={"pb20"} style={{display:"flex",justifyContent:'center'}}>
data.organizations && data.organizations.length > 0 ? {
<AlignCenter className="font-12 pt4 pb4"> currentLogin && (currentLogin === data.login)
<span>所属组织：</span> ?
<div className="task-hide flex1"> <Button className="currentBtn">当前用户</Button>
{renderArray(data.organizations)} :
</div> data.is_watch ?
</AlignCenter> <Button type={"default"} onClick={()=>FocusFunc(false,data.login)}>已关注</Button>
:"" :
} <Button type={"primary"} onClick={()=>FocusFunc(true,data.login)}>关注TA</Button>
{ }
data.location && <AlignCenter className="font-12 pt4 pb4"><span>所在地址:</span><span className="ml5">{data.location}</span></AlignCenter> </div>
}
</Spin> </Spin>
) )
setMenu(ele); setMenu(ele);

2
src/forge/Component/LanguagePower.jsx
View File

@ -25,7 +25,7 @@ function LanguagePower({languages}){
} }
return( return(
<div> <div>
<p className="font-16 color-grey-6">开发语言</p> <p className="font-16 color-ooo aboutSubTitle">开发语言</p>
<div className="progress"> <div className="progress">
{ {
array && array.map((item,key)=>{ array && array.map((item,key)=>{

3
src/forge/Component/Releases.jsx
View File

@ -19,13 +19,12 @@ function Releases({owner,projectsId,releaseVersions , baseOperate , projectType}
releaseVersions.list.map((item,key)=>{ releaseVersions.list.map((item,key)=>{
return( return(
key === 0 &&<AlignTop className="mt10"> key === 0 &&<AlignTop className="mt10">
<i className="iconfont icon-biaoqian3 color-grey-6 font-18 mr10"></i>
<div> <div>
<p className="font-16 color-grey-6"> <p className="font-16 color-grey-6">
<Link to={`/${owner}/${projectsId}/releases`}>{item.name}</Link> <Link to={`/${owner}/${projectsId}/releases`}>{item.name}</Link>
<span className="font-12 laterest ml5">最新</span> <span className="font-12 laterest ml5">最新</span>
</p> </p>
<p className="color-grey-9 font-13">{item.created_at}</p> <p className="color-grey-3 font-12">{item.created_at}</p>
</div> </div>
</AlignTop> </AlignTop>
) )

18
src/forge/Main/CoderDepot.jsx
View File

@ -321,7 +321,7 @@ function CoderDepot(props){
list = {mainFlag ? dirInfo : undefined} list = {mainFlag ? dirInfo : undefined}
/> />
<div className="drawerBtn" onClick={()=>setVisible(true)}> <div className="drawerBtn" onClick={()=>setVisible(true)}>
<i className="iconfont icon-youjiantou font-16"></i> <i className="iconfont icon-zuohuaicon font-14"></i>
<span>目录</span> <span>目录</span>
</div> </div>
</React.Fragment> </React.Fragment>
@ -334,7 +334,7 @@ function CoderDepot(props){
<div className="panelmenu"> <div className="panelmenu">
<FlexAJ> <FlexAJ>
<AlignCenter> <AlignCenter>
<div className="mr20"> <div className="mr30">
{ {
props && props.platform ? props && props.platform ?
<SelectBranch <SelectBranch
@ -363,7 +363,7 @@ function CoderDepot(props){
</Link> </Link>
</AlignCenter> </AlignCenter>
</AlignCenter> </AlignCenter>
<AlignCenter> <AlignCenter className="depotBtn">
{ {
baseOperate && ((projectDetail.type !== 2 && pullsFlag) || issuesFlag )&& baseOperate && ((projectDetail.type !== 2 && pullsFlag) || issuesFlag )&&
<div className="mr20 addOptionBtn"> <div className="mr20 addOptionBtn">
@ -379,12 +379,12 @@ function CoderDepot(props){
} }
{ fileOperate && { fileOperate &&
<Dropdown overlay={fileMenu()} className="mr10" trigger={['click']}> <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>
} }
<Dropdown overlay={downloadMenu} placement="bottomRight" trigger={['click']}> <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> </Dropdown>
</AlignCenter> </AlignCenter>
</FlexAJ> </FlexAJ>
@ -464,7 +464,7 @@ function CoderDepot(props){
<i onClick={()=>setOpenModal(true)} className="iconfont icon-anquanshezhi color-grey-9 font-15"></i> <i onClick={()=>setOpenModal(true)} className="iconfont icon-anquanshezhi color-grey-9 font-15"></i>
} }
</FlexAJ> </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 && website &&
<div className="color-grey-6 df pinfos mb5"> <div className="color-grey-6 df pinfos mb5">
@ -473,7 +473,7 @@ function CoderDepot(props){
</div> </div>
} }
<div className="pinfos mb5"> <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> <a href="#readme">README.md</a>
</div> </div>
<div className="color-grey-6 mb5"> <div className="color-grey-6 mb5">
@ -483,7 +483,7 @@ function CoderDepot(props){
{ {
projectDetail && projectDetail.license_name && projectDetail && projectDetail.license_name &&
<div> <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> <span className="color-grey-6">{projectDetail.license_name}</span>
</div> </div>
} }
@ -499,7 +499,7 @@ function CoderDepot(props){
lesson_url && lesson_url &&
<div> <div>
<Divider /> <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> <a href={lesson_url} target="_blank" className="color-grey-6" style={{textDecoration:"underline",wordBreak:"break-all"}}>{lesson_url}</a>
</div> </div>
} }

2
src/forge/Main/CoderDepotCatalogue.jsx
View File

@ -13,7 +13,7 @@ function CoderDepotCatalogue({item , goToSubRoot , owner , projectsId }){
<li> <li>
<span> <span>
<a onClick={()=>goToSubRoot(item.path,item.type,item.name)} className={item.type === "submodule" && "submoduleStyle"}> <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> </a>
</span> </span>
<span title="init project"> <span title="init project">

44
src/forge/Main/CoderDepotReadme.jsx
View File

@ -1,8 +1,7 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import RenderHtml from '../../components/render-html'; import RenderHtml from '../../components/render-html';
import { AlignCenter } from '../Component/layout'; import { AlignCenter } from '../Component/layout';
import { Dropdown , Menu , Spin } from 'antd'; import { Dropdown , Anchor , Spin } from 'antd';
import { Link } from 'react-router-dom';
import ReadmeCatelogue from './sub/ReadmeCatelogue'; import ReadmeCatelogue from './sub/ReadmeCatelogue';
const $ = window.$; const $ = window.$;
@ -33,32 +32,35 @@ function CoderDepotReadme({ operate , history , readme , ChangeFile }){
function menu(){ function menu(){
if(menuList && menuList.length > 0){ if(menuList && menuList.length > 0){
return( return(
<ReadmeCatelogue menuList={menuList}/> <ReadmeCatelogue menuList={menuList} hash={history.location.hash}/>
) )
}else{ }else{
return <Spin /> return <Spin />
} }
} }
return( return(
<div className="commonBox readBox" id="readme"> <div className="commonBox readBox" id="readme">
<div className="commonBox-title boxTitle"> <Anchor offsetTop={70} targetOffset={160}>
<AlignCenter> <div className="commonBox-title boxTitle">
<Dropdown overlay={menu()} trigger={['click']} overlayClassName="menuslist"> <AlignCenter>
<span className="catelogue"> <Dropdown overlay={menu()} trigger={['hover']} overlayClassName="menuslist">
<i className="iconfont icon-muluicon font-12 mr5"></i> <span className="catelogue">
<span>目录</span> <i className="iconfont icon-muluicon font-12 mr5"></i>
</span> <span>目录</span>
</Dropdown> </span>
<span className="commonBox-title-read">README.md</span> </Dropdown>
</AlignCenter> <span className="commonBox-title-read">README.md</span>
{ </AlignCenter>
operate ? {
<a className="ml20 pull-right" onClick={() =>ChangeFile(readme && readme.path, false)}> operate ?
<i className="iconfont icon-a-bianji font-17 color-grey-6"></i> <a className="ml20 pull-right" onClick={() =>ChangeFile(readme && readme.path, false)}>
</a> <i className="iconfont icon-a-bianji font-17 color-grey-6"></i>
:"" </a>
} :""
</div> }
</div>
</Anchor>
{ {
content && content &&
<div className="commonBox-info"> <div className="commonBox-info">

12
src/forge/Main/Detail.js
View File

@ -557,6 +557,18 @@ class Detail extends Component {
} }
</div> </div>
</AlignTop> </AlignTop>
<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 ? "" : firstSync ? "" :
<DetailBanner <DetailBanner

79
src/forge/Main/Index.scss
View File

@ -108,6 +108,31 @@
margin: 0 auto; margin: 0 auto;
.panelmenu{ .panelmenu{
padding-top:30px; 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{ .addOptionBtn{
height: 32px; height: 32px;
@ -140,15 +165,16 @@
font-size: 12px; font-size: 12px;
} }
.attrPerson{ .attrPerson{
padding-top: 15px; padding-top: 12px;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
padding-bottom: 2px;
a{ a{
margin: 10px 10px 0px 0px; margin: 0px 17px 0px 0px;
img{ img{
border-radius: 50%; border-radius: 50%;
width: 35px; width: 40px;
height: 35px; height: 40px;
} }
&:nth-child(6){ &:nth-child(6){
margin-right: 0px; margin-right: 0px;
@ -185,10 +211,11 @@
padding-left: 15px; padding-left: 15px;
position: relative; position: relative;
min-width: 33.5%; min-width: 33.5%;
font-size: 12px;
font-weight: 400;
color: #666;
span{ span{
color: #666;
&:last-child{ &:last-child{
color: #999;
margin-left: 5px; margin-left: 5px;
} }
} }
@ -300,8 +327,10 @@
.drawerBtn{ .drawerBtn{
position: fixed; position: fixed;
left: -13px; left: -13px;
border:1px solid rgb(207,205,223); width: 33px;
width: 34px; background: #FFFFFF;
box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.09);
border: 1px solid #666666;
border-radius: 0px 12px 12px 0px; border-radius: 0px 12px 12px 0px;
height: 70px; height: 70px;
top:50%; top:50%;
@ -309,29 +338,35 @@
cursor: pointer; cursor: pointer;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-end; align-items: center;
justify-content: center; justify-content: center;
padding-left: 7px;
&:hover{ &: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{ span{
writing-mode: vertical-lr; writing-mode: vertical-lr;
color: #202429; color: #333;
width: 25px; width: 25px;
font-size: 14px;
} }
i{ i{
color: #24292e; color: #333;
height: 18px; height: 14px;
line-height: 18px; line-height: 14px;
width: 18px; width: 14px;
margin-left: 2px;
margin-bottom: 3px;
} }
} }
.downMenu{ .downMenu{
width: 330px; width: 329px;
box-shadow: 0px 0px 9px rgba(134, 134, 134,0.4);
background-color: #fff; background-color: #fff;
.ant-menu-vertical .ant-menu-item:hover{ box-shadow: 0px 1px 8px 1px rgba(212, 212, 212, 0.5);
background-color: #e6f7ff; padding-bottom: 14px;
.ant-menu-item{
height: 50px;
line-height: 50px;
} }
} }
@ -378,4 +413,10 @@
white-space: pre-wrap; white-space: pre-wrap;
margin-bottom: 0px; margin-bottom: 0px;
} }
}
.ant-anchor-wrapper{
padding-left: 2px;
.ant-anchor-ink::before{
background-color: #fff;
}
} }

128
src/forge/Main/list.scss
View File

@ -220,49 +220,52 @@
.detailHeader-wrapper{ .detailHeader-wrapper{
background-color:#FBFCFF; background-color:#FBFCFF;
border-bottom:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;
/* box-shadow: 0px 2px 11px 0px#D0D0D0; */
} }
.headerMenu-wrapper{ .headerMenu-wrapper{
font-size: 16px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
} cursor: pointer;
.headerMenu-wrapper li{ li{
position: relative; font-size: 14px;
text-align: center; position: relative;
height: 40px; text-align: center;
line-height: 28px; height: 40px;
padding:0px 20px; line-height: 28px;
} padding:0px 20px;
.headerMenu-wrapper li a{ & > a{
color: #666; color: #666;
} &> img{
.headerMenu-wrapper li a > img{ margin-right: 8px;
margin-right: 8px; }
} &> span.num{
.headerMenu-wrapper li a > span.num{ line-height: 24px;
line-height: 24px; margin-left: 5px;
margin-left: 5px; margin-top: 2px;
margin-top: 2px; font-size: 12px;
font-size: 12px; float: right;
float: right; color: #666!important;
color: #666!important; background-color: rgba(153, 153, 153, 0.13);;
background-color: rgba(153, 153, 153, 0.13);; border-radius: 50%;
border-radius: 50%; width: 24px;
width: 24px; height: 24px;
height: 24px; }
} }
.headerMenu-wrapper li.active a,.headerMenu-wrapper li.active a i{ &.active a,&.active a i{
color: #2A61FF!important; color: #2A61FF!important;
} }
.headerMenu-wrapper li.active::after{ &.active::after,&:hover::after{
position: absolute; position: absolute;
bottom:0px; bottom:0px;
height:2px; height:2px;
background-color: #2A61FF; background-color: #2A61FF;
content:''; content:'';
left: 0px; left: 0px;
width:100%; width:100%;
}
&:hover::after{
background-color: rgba(153, 153, 153, 0.2);;
}
}
} }
.detail_tag_btn{ .detail_tag_btn{
height:34px; height:34px;
@ -271,32 +274,36 @@
border:1px solid #D0D0D0; border:1px solid #D0D0D0;
display: flex; display: flex;
align-items: center; align-items: center;
margin-left: 30px; margin-left: 10px;
padding:0px; padding:0px;
background-color:#FAFBFC; background-color:#FAFBFC;
box-shadow: none; box-shadow: none;
} &:hover{
.detail_tag_btn:hover{ background-color: #F3F4F6;
background-color: #F3F4F6; }
.detail_tag_btn_name{
padding:0px 18px;
min-width: 82px;
text-align: center;
&:hover>span{
color: #333!important;
}
img{
margin-right: 10px;
}
}
.detail_tag_btn_count{
width: 42px;
text-align: center;
background: #fff;
border-radius: 0px 4px 4px 0px;
height:100%;
border-left: 1px solid #D0D0D0;
}
} }
.ant-tooltip { .ant-tooltip {
max-width: fit-content!important; max-width: fit-content!important;
} }
.detail_tag_btn_name{
padding:0px 10px;
color: #666!important;
}
.detail_tag_btn_name img{
margin-right: 10px;
}
.detail_tag_btn_count{
width: 42px;
text-align: center;
background: #fff;
border-radius: 0px 4px 4px 0px;
height:100%;
border-left: 1px solid #D0D0D0;
}
.files-md{ .files-md{
padding:20px; padding:20px;
} }
@ -347,6 +354,7 @@
.gitAddressClone{ .gitAddressClone{
margin:0px 20px 14px 20px!important;
display: flex; display: flex;
height: 40px; height: 40px;
align-items: center; align-items: center;
@ -658,9 +666,7 @@
.item:last-child{ .item:last-child{
border-bottom:none; border-bottom:none;
} }
.gitAddressClone{
margin: 0 !important;
}
.item_title small{ .item_title small{
font-weight: 400; font-weight: 400;
margin-left: 10px; margin-left: 10px;

2
src/forge/Main/sub/DetailBanner.jsx
View File

@ -18,7 +18,7 @@ function DetailBanner({ history,list , owner , projectsId , isManager , url , pa
} }
},[list]); },[list]);
return( return(
<div className="f-wrap-between mt15"> <div className="f-wrap-between mt25">
{ {
menuName && projectDetail ? menuName && projectDetail ?
<ul className="headerMenu-wrapper"> <ul className="headerMenu-wrapper">

10
src/forge/Main/sub/ReadmeCatelogue.jsx
View File

@ -1,11 +1,11 @@
import React , {useState } from 'react'; import React , { useState , useEffect } from 'react';
import { Anchor , Input } from 'antd'; import { Anchor , Input } from 'antd';
import './sub.scss'; import './sub.scss';
import { Base64 } from 'js-base64';
const { Link } = Anchor; const { Link } = Anchor;
const { Search } = Input;
function ReadmeCatelogue({ menuList }) { function ReadmeCatelogue({ menuList , hash }) {
const [ goHref , setGoHref ] = useState(""); const [ goHref , setGoHref ] = useState("");
const [ value , setValue ] = useState(""); const [ value , setValue ] = useState("");
const [ menu , setMenu] = useState(menuList); const [ menu , setMenu] = useState(menuList);
@ -18,7 +18,7 @@ function ReadmeCatelogue({ menuList }) {
function changeValue(e) { function changeValue(e) {
setValue(e.target.value); setValue(e.target.value);
if(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); setMenu(m);
}else{ }else{
setMenu(menuList); setMenu(menuList);
@ -41,7 +41,7 @@ function ReadmeCatelogue({ menuList }) {
menu.map((item,key)=>{ menu.map((item,key)=>{
return( return(
<div style={{paddingLeft:`${item.level *10}px`}} className={goHref===item.href?"items active":"items"}> <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> </div>
) )
}) })

5
src/forge/Main/sub/sub.scss
View File

@ -34,13 +34,10 @@
padding:15px; padding:15px;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
} }
.anchorBox{
max-height: 255px;
overflow-y: auto;
}
.ant-anchor-wrapper{ .ant-anchor-wrapper{
margin-left: 0px; margin-left: 0px;
padding:5px 15px; padding:5px 15px;
max-height: 255px!important;
.items{ .items{
border-radius: 4px; border-radius: 4px;
margin-bottom: 5px; margin-bottom: 5px;

2
src/forge/css/index.scss
View File

@ -11,7 +11,7 @@ ul,ol,dl{
font-size: 22px; font-size: 22px;
font-weight: normal; font-weight: normal;
line-height: 30px; line-height: 30px;
max-width: 700px; max-width: 690px;
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;