From ec55870cc86bebad0bfcb10bbd3f7f2fc7d04258 Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Tue, 11 Oct 2022 15:05:35 +0200
Subject: [PATCH] UI for featured plugin has been changed

---
 .../src/lib/components/homeTabFeaturedPlugins.tsx      |  1 -
 .../home-tab/src/lib/components/homeTabGetStarted.tsx  |  1 -
 .../home-tab/src/lib/components/homeTabLearn.tsx       |  6 +++---
 .../home-tab/src/lib/components/homeTabTitle.tsx       |  1 -
 .../home-tab/src/lib/components/pluginButton.tsx       |  5 ++---
 .../home-tab/src/lib/components/workspaceTemplate.tsx  |  2 +-
 libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.css   | 10 +++++-----
 libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx   |  2 +-
 8 files changed, 12 insertions(+), 16 deletions(-)

diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx
index 212892f5ac..337491e648 100644
--- a/libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx
+++ b/libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx
@@ -30,7 +30,6 @@ function HomeTabFeaturedPlugins ({plugin}: HomeTabFeaturedPluginsProps) {
   }, [])
 
   const handleScroll = (e) => {
-    console.log("e = ", e)   
   }
 
   const startSolidity = async () => {
diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx
index 32e2a26d35..92b4c2f6d2 100644
--- a/libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx
+++ b/libs/remix-ui/home-tab/src/lib/components/homeTabGetStarted.tsx
@@ -24,7 +24,6 @@ function HomeTabGetStarted ({plugin}: HomeTabGetStartedProps) {
     const timeStamp = Date.now()
     await plugin.call('filePanel', 'createWorkspace', templateName + "_" + timeStamp, templateName)
     await plugin.call('filePanel', 'setWorkspace', templateName + "_" + timeStamp)
-    console.log("templateName ", templateName)
     plugin.verticalIcons.select('filePanel')
     _paq.push(['trackEvent', 'homeGetStarted', templateName])
   }
diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx
index 7064acfba2..b8c2143ee4 100644
--- a/libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx
+++ b/libs/remix-ui/home-tab/src/lib/components/homeTabLearn.tsx
@@ -53,19 +53,19 @@ function HomeTabLearn ({plugin}: HomeTabLearnProps) {
           <label className="float-left" style={{fontSize: "1rem"}}>Remix Basics</label>
           {(state.visibleTutorial === VisibleTutorial.Basics) && <div className="pt-2 d-flex flex-column text-left">
             <span>Introduction to Remix's interface and concepts used in Ethereum, as well as the basics of Solidity.</span>
-            <button className="btn-sm mt-2 btn-primaryy" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('basics')}>Get Started</button>
+            <button className="btn-sm mt-2" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('basics')}>Get Started</button>
           </div>}
         </button>
         <button className="d-flex flex-column btn border" onClick={() => setState((prevState) => {return { ...prevState, visibleTutorial: VisibleTutorial.Intermediate }})}>
           <label className="float-left" style={{fontSize: "1rem"}}>Remix Intermediate</label>
           {(state.visibleTutorial === VisibleTutorial.Intermediate) && <div className="pt-2 d-flex flex-column text-left">Using the web3.js to interact with a contract. Using Recorder tool.
-          <button className="btn-sm mt-2 btn-primaryy" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('useofweb3js')}>Get Started</button>
+          <button className="btn-sm mt-2" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('useofweb3js')}>Get Started</button>
           </div>}
         </button>
         <button className="d-flex flex-column btn border" onClick={() => setState((prevState) => {return { ...prevState, visibleTutorial: VisibleTutorial.Advanced }})}>
           <label className="float-left" style={{fontSize: "1rem"}}>Remix Advanced</label>
           {(state.visibleTutorial === VisibleTutorial.Advanced) && <div className="pt-2 d-flex flex-column text-left">Learn the Proxy Pattern and working with Libraries in Remix. Learn to use the Debugger.
-          <button className="btn-sm mt-2 btn-primaryy" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('deploylibraries')}>Get Started</button>
+          <button className="btn-sm mt-2" style={{width: 'fit-content'}} onClick={() => startLearnEthTutorial('deploylibraries')}>Get Started</button>
           </div>}
         </button>
       </div>
diff --git a/libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx b/libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx
index e3cd793775..686c8d1a1f 100644
--- a/libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx
+++ b/libs/remix-ui/home-tab/src/lib/components/homeTabTitle.tsx
@@ -31,7 +31,6 @@ function HomeTabTitle() {
       openLink()
       searchInputRef.current.value = ""
     } else {
-      console.log("handleSearchKeyDown")
       setState(prevState => {
         return { ...prevState, searchDisable: searchInputRef.current.value === "" }
       })
diff --git a/libs/remix-ui/home-tab/src/lib/components/pluginButton.tsx b/libs/remix-ui/home-tab/src/lib/components/pluginButton.tsx
index 9f944679d3..a50f380ccc 100644
--- a/libs/remix-ui/home-tab/src/lib/components/pluginButton.tsx
+++ b/libs/remix-ui/home-tab/src/lib/components/pluginButton.tsx
@@ -15,15 +15,14 @@ interface PluginButtonProps {
 function PluginButton ({ imgPath, envID, envText, callback, l2, description, remixMaintained }: PluginButtonProps) {
   const themeFilter = useContext(ThemeContext)
 
-  console.log("themeFilter ", themeFilter)
   return (
     <div className="d-flex remixui_home_envButton">
       <button
-        className="btn border-secondary d-flex text-nowrap justify-content-center align-items-center mr-2 remixui_home_envButton"
+        className="btn border-secondary d-flex flex-column  pb-2 text-nowrap justify-content-center align-items-center mr-2 remixui_home_envButton"
         data-id={'landingPageStart' + envText}
         onClick={() => callback()}
       >
-        <img className="px-2 align-self-center remixui_home_envLogo" id={envID} src={imgPath} alt="" style={ { filter: themeFilter.filter } } />
+        <img className="px-2 mb-2 align-self-center remixui_home_envLogo" id={envID} src={imgPath} alt="" style={ { filter: themeFilter.filter } } />
         <div className="h-100 d-flex flex-column">
           <label className="text-uppercase text-dark remixui_home_cursorStyle">{envText}</label>
           <div className="remixui_home_envLogoDescription">{description}</div>
diff --git a/libs/remix-ui/home-tab/src/lib/components/workspaceTemplate.tsx b/libs/remix-ui/home-tab/src/lib/components/workspaceTemplate.tsx
index 11dd2a4889..293d5ddb1b 100644
--- a/libs/remix-ui/home-tab/src/lib/components/workspaceTemplate.tsx
+++ b/libs/remix-ui/home-tab/src/lib/components/workspaceTemplate.tsx
@@ -20,7 +20,7 @@ function WorkspaceTemplate ({ gsID, workspaceTitle, description, callback }: Wor
         onClick={() => callback()}
       >
         <div className="w-100 p-2 h-100 align-items-start d-flex flex-column">
-          <label className="h6 text-uppercase text-dark remixui_home_cursorStyle">{workspaceTitle}</label>
+          <label className="h6 pb-2 text-uppercase text-dark remixui_home_cursorStyle">{workspaceTitle}</label>
           <div className="remixui_home_gtDescription">{description}</div>
         </div>
       </button>
diff --git a/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.css b/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.css
index b044dd2f10..cb2f2cb70c 100644
--- a/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.css
+++ b/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.css
@@ -67,7 +67,7 @@
 }
 .remixui_home_envLogoDescription {
   white-space: pre-wrap;
-  font-size: x-small;
+  font-size: small;
   line-height: 0.8rem;
   text-align: left;
 }
@@ -84,7 +84,7 @@
 .remixui_home_envButton {
   width: 220px;
   cursor: pointer;
-  height: 80px;
+  height: 130px;
 }
 .remixui_home_workspaceTemplate {
   width: 220px;
@@ -100,10 +100,10 @@
   width: 100px;
 }
 .remixui_home_l2Label {
-  top: 70px;
+  top: 120px;
   right: 180px;
 }
 .remixui_home_maintainedLabel {
-  top: 70px;
-  right: 288px;
+  top: 120px;
+  right: 180px;
 }
diff --git a/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx b/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx
index 6a19f28324..af3f81d7a3 100644
--- a/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx
+++ b/libs/remix-ui/home-tab/src/lib/remix-ui-home-tab.tsx
@@ -79,8 +79,8 @@ export const RemixUiHomeTab = (props: RemixUiHomeTabProps) => {
         </div>
         <div className="pl-2 pr-3 justify-content-start d-flex flex-column" style={{width: "65%"}} id="remixUIHTRight">
           <HomeTabFeatured></HomeTabFeatured>
-          <HomeTabFeaturedPlugins plugin={plugin}></HomeTabFeaturedPlugins>
           <HomeTabGetStarted plugin={plugin}></HomeTabGetStarted>
+          <HomeTabFeaturedPlugins plugin={plugin}></HomeTabFeaturedPlugins>
           <HomeTabScamAlert></HomeTabScamAlert>
         </div>
       </ThemeContext.Provider>