convert to components

This commit is contained in:
Laux Dev
2026-02-27 16:07:07 +08:00
parent 6afc34a96c
commit 2e772b2044
20 changed files with 236 additions and 56 deletions

View File

@@ -4,6 +4,7 @@ import globalStyle from "@/app/globalStyle.module.css";
import TopHeader from "@/app/components/topHeader/TopHeader";
import styles from "./styles.module.css";
import variableStyles from "./variableStyles.module.css";
import TextField from "@/app/components/fields/textfield";
const AddServices = () => {
const [triggerVariableDropDown, setTriggerVariableDropDown] = useState(false);
@@ -37,11 +38,11 @@ const AddServices = () => {
<div>
<div>
<p>Name</p>
<input type="text" placeholder="Enter service name" />
<TextField placeHolder="Enter service name" />
</div>
<div>
<p>Version</p>
<input type="text" placeholder="Service version" />
<TextField placeHolder="Service version" />
</div>
</div>
<div>
@@ -49,13 +50,13 @@ const AddServices = () => {
<p>
Image <span>(Optional)</span>
</p>
<input type="text" placeholder="Enter image name" />
<TextField placeHolder="Enter image name" />
</div>
</div>
<div>
<div>
<p>Port</p>
<input type="text" placeholder="Enter port" />
<TextField placeHolder="Enter port" />
</div>
</div>
<div>
@@ -82,21 +83,21 @@ const AddServices = () => {
<div>
<div>
<p>CPU Request (MB)</p>
<input type="text" placeholder="100" />
<TextField placeHolder="250" />
</div>
<div>
<p>CPU Limit (MB)</p>
<input type="text" placeholder="250" />
<TextField placeHolder="250" />
</div>
</div>
<div>
<div>
<p>Memory Request (MB)</p>
<input type="text" placeholder="250" />
<TextField placeHolder="250" />
</div>
<div>
<p>Memory Limit (MB)</p>
<input type="text" placeholder="500" />
<TextField placeHolder="500" />
</div>
</div>
</div>
@@ -114,14 +115,12 @@ const AddServices = () => {
<div>
<div>
<p>Name</p>
<input
type="text"
placeholder="Enter service name"
/>
<TextField placeHolder="Enter service name" />
</div>
<div>
<p>Version</p>
<input type="text" placeholder="Service version" />
<TextField placeHolder="Services version" />
</div>
</div>
</div>
@@ -169,17 +168,12 @@ const AddServices = () => {
<div>
<div>
<p>Liveness Path</p>
<input
type="text"
placeholder="Enter liveness path"
/>
<TextField placeHolder="Enter liveness path" />
</div>
<div>
<p>Liveness Port</p>
<input
type="text"
placeholder="Enter liveness port"
/>
<TextField placeHolder="Enter liveness port" />
</div>
</div>
</div>