From c159b7a78152a4ccf2f8f6618bfc343d5886662e Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Mon, 9 Sep 2024 15:15:08 +0800
Subject: [PATCH] chore: transform field type css to tailwind and multi theme

---
 .../config-var/select-type-item/index.tsx     |  7 ++--
 .../select-type-item/style.module.css         | 40 -------------------
 2 files changed, 4 insertions(+), 43 deletions(-)
 delete mode 100644 web/app/components/app/configuration/config-var/select-type-item/style.module.css

diff --git a/web/app/components/app/configuration/config-var/select-type-item/index.tsx b/web/app/components/app/configuration/config-var/select-type-item/index.tsx
index e747e86619..f96e80cb78 100644
--- a/web/app/components/app/configuration/config-var/select-type-item/index.tsx
+++ b/web/app/components/app/configuration/config-var/select-type-item/index.tsx
@@ -2,7 +2,6 @@
 import type { FC } from 'react'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
-import s from './style.module.css'
 import cn from '@/utils/classnames'
 import type { InputVarType } from '@/app/components/workflow/types'
 import InputVarTypeIcon from '@/app/components/workflow/nodes/_base/components/input-var-type-icon'
@@ -27,13 +26,15 @@ const SelectTypeItem: FC<ISelectTypeItemProps> = ({
 
   return (
     <div
-      className={cn('space-y-1', selected && s.selected, s.item)}
+      className={cn(
+        'flex flex-col justify-center items-center h-[58px] rounded-lg border border-components-option-card-option-border bg-components-option-card-option-bg space-y-1',
+        selected ? 'border-[1.5px] border-components-option-card-option-selected-border bg-components-option-card-option-selected-bg shadow-xs system-xs-medium' : ' hover:border-components-option-card-option-border-hover hover:bg-components-option-card-option-bg-hover hover:shadow-xs cursor-pointer system-xs-regular')}
       onClick={onClick}
     >
       <div className='shrink-0'>
         <InputVarTypeIcon type={type} className='w-5 h-5' />
       </div>
-      <span className={cn(s.text)}>{typeName}</span>
+      <span>{typeName}</span>
     </div>
   )
 }
diff --git a/web/app/components/app/configuration/config-var/select-type-item/style.module.css b/web/app/components/app/configuration/config-var/select-type-item/style.module.css
deleted file mode 100644
index 5007ed7fed..0000000000
--- a/web/app/components/app/configuration/config-var/select-type-item/style.module.css
+++ /dev/null
@@ -1,40 +0,0 @@
-.item {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  height: 58px;
-  /* width: 98px; */
-  border-radius: 8px;
-  border: 1px solid #EAECF0;
-  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
-  background-color: #fff;
-  cursor: pointer;
-}
-
-.item:not(.selected):hover {
-  border-color: #B2CCFF;
-  background-color: #F5F8FF;
-  box-shadow: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);
-}
-
-.item.selected {
-  color: #155EEF;
-  border-color: #528BFF;
-  background-color: #F5F8FF;
-  box-shadow: 0px 1px 3px rgba(16, 24, 40, 0.1), 0px 1px 2px rgba(16, 24, 40, 0.06);
-}
-
-.text {
-  font-size: 13px;
-  color: #667085;
-  font-weight: 500;
-}
-
-.item.selected .text {
-  color: #155EEF;
-}
-
-.item:not(.selected):hover {
-  color: #344054;
-}
\ No newline at end of file