Change Index Category3

src/forge/Main/Index.js

@@ -360,31 +360,29 @@ class Index extends Component {
         <p className="t_project_banner"></p>
         <div className="ProjectListIndex">
           <div className="list-left">
-            <Affix offsetTop={5} style={{maxHeight: "100vh"}}>
-              <div className="list-affix mb20">
-              <Spin spinning={languageSpin}>
-                <ul className="list-l-Menu">
-                  <li className="MenuTitle">
-                    <i className="iconfont icon-bianchengyuyan color-grey-9 font-15 mr5"></i>
-                    语言
-                  </li>
-                  {typeList}
-                </ul>
-              </Spin>
+            <Affix offsetTop={5} style={{ position: "sticky", maxHeight: "100vh"}}>
+              <div className="mb20">
+                <Spin spinning={languageSpin}>
+                  <ul className="list-l-Menu">
+                    <li className="MenuTitle">
+                      <i className="iconfont icon-bianchengyuyan color-grey-9 font-15 mr5"></i>
+                      语言
+                    </li>
+                    <div className="list-affix">{typeList}</div>
+                  </ul>
+                </Spin>
               </div>
-              <div className="list-affix mb20">
-              <Spin spinning={categorySpin}>
-                <ul className="list-l-Menu">
-                  <li className="MenuTitle">
-                    <i className="iconfont icon-xiangmuleibie color-grey-9 font-15 mr5"></i>
-                    项目类别
-                  </li>
-                  {categoryList}
-                </ul>
-              </Spin>
+              <div className="mb20">
+                <Spin spinning={categorySpin}>
+                  <ul className="list-l-Menu">
+                    <li className="MenuTitle">
+                      <i className="iconfont icon-xiangmuleibie color-grey-9 font-15 mr5"></i>
+                      项目类别
+                    </li>
+                    <div className="list-affix">{categoryList}</div>
+                  </ul>
+                </Spin>
               </div>
-              
-              
             </Affix>
           </div>
           <div

src/forge/Main/IndexItem.js

@@ -25,7 +25,7 @@ class IndexItem extends Component {
             </Link>
             <div className="p-r-Infos">
               <div className="p-r-name">
-                <Link to={`/projects/${item.author.login}/${item.identifier}`} className="hide-1 color-grey-3 font-18 task-hide " style={{ whiteSpace: "wrap", display: 'flex', width: 400 }}>
+                <Link to={`/projects/${item.author.login}/${item.identifier}`} className="hide-1 color-grey-3 font-18 task-hide font-bd " style={{ whiteSpace: "wrap", display: 'flex', width: 400 }}>
                   {item.author.name}/{item.name}
                   {
                     item.forked_from_project_id ?
@@ -50,7 +50,7 @@ class IndexItem extends Component {
                   <span><i className="iconfont icon-fork mr3 font-16" style={{ color: "#1B8FFF" }} />fork ({item.forked_count})</span>
                 </span>
               </div>
-              <p className="break_word task-hide-2 mt10" style={{ maxHeight: "44px",lineHeight:"22px" }}>{item.description}</p>
+              <p className="break_word task-hide-2 mt8 color-grey-3 " style={{ maxHeight: "44px",lineHeight:"22px" }}>{item.description}</p>
 
               <div className="p-r-about">
                 <span className="p-r-detail">

src/forge/Main/list.css

@@ -96,10 +96,15 @@
   box-shadow:0px 2px 20px 10px rgba(0,0,0,0.03);
 }
 .p-r-photo{
-  width: 60px;
-  height: 60px;
+  width: 40px;
+  height: 40px;
   border-radius: 50%;
-  margin-right: 22px;
+  margin-right: 18px;
+}
+.p-r-detail{
+  font-size: 12px;
+color: #888888;
+line-height: 16px;
 }
 .p-r-Infos{
   flex: 1;

src/forge/css/index.scss

@@ -155,8 +155,8 @@ form{
 .list-affix{
   -ms-overflow-style: none;
   overflow: -moz-scrollbars-none;
-  min-height: 200px;
-  max-height: 45vh;
+  min-height: 20px;
+  max-height: 32.5vh;
   overflow-y: auto;
 }
 .vh-100{
@@ -171,14 +171,14 @@ form{
   box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.08);
   border-radius: 5px;
 
-  &>li{
+  & li{
     font-size: 1rem;
     padding:0px 0px 0px 20px;
     box-sizing: border-box;
     color: #333;
     position: relative;
     border-radius: 5px;
-    & > p{
+    & p{
       height: 62px; 
       line-height: 62px;
       width: 100%;
@@ -215,13 +215,13 @@ form{
     background: #4CACFF;
   }
   .MenuTitle{
-    font-size: 16px;
+    font-size: 18px;
     background-size: 100% 100%;
     color: #333!important;
     height: 62px;
     line-height: 62px;
     border-bottom: 1px solid #eeeeee;
-    font-weight: 400;
+    font-weight: 500;
   }
   .ant-menu-inline{
     border:none;
@@ -232,4 +232,5 @@ form{
   .ant-menu-item-group-title{
     padding:0px;
   }
+
 }