ENH: Homepage-contextmenu UI same with prepare-ui

Change-Id: I8745ce516f2d1dd945826ec6e1f14aba6ec793bb

resources/web/homepage/css/home.css

@@ -370,11 +370,12 @@ body
 {
 	position: absolute;
 	margin: 0px;
-	padding: 0px;
+	padding: 10px;
 	border: 0px;
 	min-width: 100px;
     top: 800px;
 	border: 1px solid #C3C3C3;
+	border-radius: 5px;
 	color: #323A3D;
 	background-color: #fff;
     display: none;
@@ -385,15 +386,16 @@ body
 	padding: 2px 10px;
 	display: flex;
 	flex-direction: row;
-	align-content: center;
 	align-items: center;
 	border: 2px solid #fff;
+	border-radius: 4px;	
 }
 
 .CT_Item:hover
 {
 	cursor: pointer;
-	border: 2px solid #00AE42;
+	background-color: #0078D4;
+	color: #fff;
 }
 
 
@@ -404,16 +406,30 @@ body
 	height: 16px;	
 }
 
+#CT_Delete_Bar:hover  .CT_Delete
+{
+	background: url("../img/remove2.svg");
+	background-repeat: no-repeat;
+	background-size: contain;	
+}
+
 .CT_Delete
 {
-	background: url("../img/delete.png");
+	background: url("../img/remove.svg");
+	background-repeat: no-repeat;
+	background-size: contain;	
+}
+
+#CT_Folder_Bar:hover .CT_Explore
+{
+	background: url("../img/open_folder2.svg");
 	background-repeat: no-repeat;
 	background-size: contain;	
 }
 
 .CT_Explore
 {
-	background: url("../img/folder.png");
+	background: url("../img/open_folder.svg");
 	background-repeat: no-repeat;
 	background-size: contain;		
 }
@@ -426,7 +442,9 @@ body
 
 .CT_Text
 {
-
+	line-height: 20px;
+	height: 20px;	
+	display: block;
 }
 
 /*--------Mall------*/

resources/web/homepage/img/open_folder2.svg

@@ -0,0 +1,4 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.34801 3.82127C8.71179 4.19206 9.20969 4.40069 9.7295 4.40069H11.3196C11.4502 4.40069 11.5773 4.41559 11.7 4.44276V3.14981C11.7 2.62475 11.274 2.19873 10.749 2.19873H7.00335C6.92533 2.19873 6.8517 2.211 6.77895 2.22853C6.79385 2.24256 6.80875 2.25483 6.82277 2.26886L8.34801 3.82127Z" stroke="white" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M11.7 4.44284C11.5773 4.41566 11.4502 4.40076 11.3196 4.40076H9.72951C9.2097 4.40076 8.71268 4.19214 8.34803 3.82135L6.82279 2.26893C6.80876 2.25491 6.79298 2.24176 6.77896 2.22861C6.45726 1.92269 6.03036 1.75 5.58419 1.75H2.34787C1.374 1.75 0.583328 2.53979 0.583328 3.51455V10.6402C0.583328 11.615 1.37312 12.4048 2.34787 12.4048H11.3196C12.2944 12.4048 13.0842 11.615 13.0842 10.6402V6.16531C13.0842 5.32117 12.4916 4.61728 11.7 4.44284Z" stroke="white" stroke-miterlimit="10" stroke-linecap="round"/>
+</svg>

resources/web/homepage/img/remove2.svg

@@ -0,0 +1,14 @@
+<svg width="14" height="15" viewBox="0 0 14 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7844_34237)">
+<path d="M11.8245 5.10425V13.1577C11.8245 13.431 11.5708 13.6544 11.2604 13.6544H2.73973C2.42934 13.6544 2.17566 13.431 2.17566 13.1577V5.10425" stroke="white" stroke-width="0.8" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M0.965012 3.55176H13.0353" stroke="white" stroke-width="0.8" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M4.31033 1.55829C4.31033 1.55829 4.31033 1.38921 4.31033 1.18246C4.31033 0.975717 4.56401 0.806641 4.8744 0.806641H9.1263C9.43668 0.806641 9.69036 0.975717 9.69036 1.18246C9.69036 1.38921 9.69036 1.55829 9.69036 1.55829" stroke="white" stroke-width="0.8" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M5.23859 5.29443V12.0461" stroke="white" stroke-width="0.8" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M8.76242 5.29443V12.0461" stroke="white" stroke-width="0.8" stroke-miterlimit="10" stroke-linecap="round"/>
+</g>
+<defs>
+<clipPath id="clip0_7844_34237">
+<rect width="14" height="15" fill="white"/>
+</clipPath>
+</defs>
+</svg>

resources/web/homepage/index.html

@@ -139,18 +139,18 @@
 				<div class="FileImg"><img src="img/b.jpg"/></div>
 				<a>abcd12334.3mf</a>
 				<div class="FileDate">2021/12/27 09:22</div>
-			</div>			-->	
+			</div>-->				
 		</div>
 	</div>
 	
     <div style="height: 14px;"></div>	
 	
 	<div id="recnet_context_menu">
-		<div class="CT_Item" onClick="OnDeleteRecentFile()">
+		<div id="CT_Delete_Bar" class="CT_Item" onClick="OnDeleteRecentFile()">
 			<div class="CT_Icon CT_Delete"></div>
 			<div class="CT_Text trans" tid="t88">clear</div>
 		</div>
-		<div class="CT_Item " onClick="OnExploreRecentFile()" >
+		<div id="CT_Folder_Bar" class="CT_Item " onClick="OnExploreRecentFile()" >
 			<div class="CT_Icon CT_Explore"></div>
 			<div class="CT_Text trans" tid="t89">open in explorer </div>
 		</div>				

resources/web/homepage/js/home.js

@@ -4,10 +4,10 @@
 function OnInit()
 {	
 	//-----Test-----
-    //$("#Login1").hide();
+	//Set_RecentFile_MouseRightBtn_Event();
-	//$("#UserName").text("ZZZZZZZZ");
-	//$("#Login2").css("display","flex");
 	
+	
+	//-----Official-----
     TranslatePage();
 
 	SendMsg_GetLoginInfo();