diff --git a/libs/system/sdk.js b/libs/system/sdk.js
index 722255e..1ff1774 100644
--- a/libs/system/sdk.js
+++ b/libs/system/sdk.js
@@ -8,69 +8,69 @@ const win = {
 	create: (name, codename) => {
 		return new Promise((resolve) => {
 			// Default Values if none provided
-            const properties = {
-                name,
-                codename,
-                width: 500,
-                height: 400,
-                x: 100,
-                y: 100,
-                max: false,
-                min: false,
-                autosize: false,
-                fullscreen: false,
-            };
+			const properties = {
+				name,
+				codename,
+				width: 500,
+				height: 400,
+				x: 100,
+				y: 100,
+				max: false,
+				min: false,
+				autosize: false,
+				fullscreen: false,
+			};
 
 			const win = {
 				codename,
 				name,
-                setWidth: (w) => {
-                    properties.width = w;
-                    return win;
-                },
-                setHeight: (h) => {
-                    properties.height = h;
-                    return win;
-                },
-                setX: (xpos) => {
-                    properties.x = xpos;
-                    return win;
-                },
-                setY: (ypos) => {
-                    properties.y = ypos;
-                    return win;
-                },
-                setMax: (maximize) => {
-                    properties.max = maximize;
-                    return win;
-                },
-                setMin: (minimize) => {
-                    properties.min = minimize;
-                    return win;
-                },
-                setAutosize: (auto) => {
-                    properties.autosize = auto;
-                    return win;
-                },
-                setFullscreen: (fullscreenapp) => {
-                    properties.fullscreen = fullscreenapp;
-                    return win;
-                },
-                confirm: () => {
-                    createDynamicWindow(
-                        properties.name,
-                        codename,
-                        properties.width,
-                        properties.height,
-                        properties.x,
-                        properties.y,
-                        properties.max,
-                        properties.min,
-                        properties.autosize,
-                        properties.fullscreen
-                        // document.currentScript
-                    );
-                }
+				setWidth: (w) => {
+					properties.width = w;
+					return win;
+				},
+				setHeight: (h) => {
+					properties.height = h;
+					return win;
+				},
+				setX: (xpos) => {
+					properties.x = xpos;
+					return win;
+				},
+				setY: (ypos) => {
+					properties.y = ypos;
+					return win;
+				},
+				setMax: (maximize) => {
+					properties.max = maximize;
+					return win;
+				},
+				setMin: (minimize) => {
+					properties.min = minimize;
+					return win;
+				},
+				setAutosize: (auto) => {
+					properties.autosize = auto;
+					return win;
+				},
+				setFullscreen: (fullscreenapp) => {
+					properties.fullscreen = fullscreenapp;
+					return win;
+				},
+				confirm: () => {
+					createDynamicWindow(
+						properties.name,
+						codename,
+						properties.width,
+						properties.height,
+						properties.x,
+						properties.y,
+						properties.max,
+						properties.min,
+						properties.autosize,
+						properties.fullscreen
+						// document.currentScript
+					);
+				}
 			};
 			resolve(win);
 		});
@@ -86,10 +86,10 @@ const element = {
 			const elementObject = {
 				codename,
 				element: elm,
-                attribute: (name, value) => {
-                    elm.setAttribute(name, value);
-                    return elementObject;
-                },
+				attribute: (name, value) => {
+					elm.setAttribute(name, value);
+					return elementObject;
+				},
 				class: (className) => {
 					elm.classList.add(className);
 					return elementObject;
@@ -102,238 +102,302 @@ const element = {
 					elm.classList.add('__azuos-sdk-align-center');
 					return elementObject;
 				},
-                alignx: (alignment) => {
-                    elm.classList.add('__azuos-sdk-alignx-center');
-                    return elementObject;
-                },
-                aligny: (alignment) => {
-                    elm.classList.add('__azuos-sdk-aligny-center');
-                    return elementObject;
-                },
+				alignx: (alignment) => {
+					elm.classList.add('__azuos-sdk-alignx-center');
+					return elementObject;
+				},
+				aligny: (alignment) => {
+					elm.classList.add('__azuos-sdk-aligny-center');
+					return elementObject;
+				},
 				textalign: (textalignment) => {
 					elm.style.textAlign = textalignment;
 					return elementObject;
 				},
-                color: (color) => {
-                    elm.style.color = color;
-                    return elementObject;
-                },
-                textshadow: (shadow) => {
-                    elm.style.textshadow = shadow;
-                    return elementObject;
-                },
-                boxshadow: (shadow) => {
-                    elm.style.boxShadow = shadow;
-                    return elementObject;
-                },
-                dropshadow: (shadow) => {
-                    elm.style.filter = `drop-shadow(${shadow})`;
-                    return elementObject;
-                },
-                opacity: (opacity) => {
-                    elm.style.opacity = opacity;
-                    return elementObject;
-                },
-                backgroundcolor: (color) => {
-                    elm.style.background = color;
-                    return elementObject;
-                },
-                backgroundimage: (image) => {
-                    elm.style.backgroundImage = `url(${image.replace(/ /g, '%20')})`;
-                    // console.log(`url(${image.replace(/ /g, '%20')})`)
-                    return elementObject;
-                },
-                backgroundrepeat: (repeat) => {
-                    elm.style.backgroundRepeat = repeat;
-                    return elementObject;
-                },
-                backgroundposition: (pos) => {
-                    elm.style.backgroundRepeat = pos;
-                    return elementObject;
-                },
-                backgroundsize: (size) => {
-                    elm.style.backgroundSize = size;
-                    return elementObject;
-                },
-                backgroundattachment: (attach) => {
-                    elm.style.backgroundAttachment = attach;
-                    return elementObject;
-                },
-                backgroundclip: (clip) => {
-                    elm.style.backgroundClip = cliprepeat;
-                    return elementObject;
-                },
-                backgroundorigin: (origin) => {
-                    elm.style.backgroundOrigin = origin;
-                    return elementObject;
-                },
-                backgroundblend: (mode) => {
-                    elm.style.backgroundBlendMode = mode;
-                    return elementObject;
-                },
-                backdropfilter: (filter) => {
-                    elm.style.backdropFilter = filter;
-                    return elementObject;
-                },
-                filter: (filter) => {
-                    elm.style.filter = filter;
-                    return elementObject;
-                },
-                overflow: (overflow) => {
-                    elm.style.overflow = overflow;
-                    return elementObject;
-                },
-                overflowx: (overflow) => {
-                    elm.style.overflowx = overflow;
-                    return elementObject;
-                },
-                overflowy: (overflow) => {
-                    elm.style.overflowy = overflow;
-                    return elementObject;
-                },
-                scale: (scale) => {
-                    elm.style.scale = scale;
-                    return elementObject;
-                },
-                clippath: (clip) => {
-                    elm.style.clipPath = clip;
-                    return elementObject;
-                },
-                source: (srcimg) => {
-                    elm.src = srcimg;
-                    return elementObject;
-                },
-                src: (srcimg) => {
-                    elm.src = srcimg;
-                    return elementObject;
-                },
-                width: (width) => {
-                    if (elm.tagName === 'IMG' || elm.tagName === 'VIDEO' || elm.tagName === 'CANVAS') {
-                        elm.width = width;
-                    } else {
-                        elm.style.width = width;
-                    }
-                    return elementObject;
-                },
+				color: (color) => {
+					elm.style.color = color;
+					return elementObject;
+				},
+				textshadow: (shadow) => {
+					elm.style.textshadow = shadow;
+					return elementObject;
+				},
+				boxshadow: (shadow) => {
+					elm.style.boxShadow = shadow;
+					return elementObject;
+				},
+				dropshadow: (shadow) => {
+					elm.style.filter = `drop-shadow(${shadow})`;
+					return elementObject;
+				},
+				opacity: (opacity) => {
+					elm.style.opacity = opacity;
+					return elementObject;
+				},
+				border: (string) => {
+					elm.style.border = string;
+					return elementObject;
+				},
+				outline: (string) => {
+					elm.style.outline = string;
+					return elementObject;
+				},
+				backgroundcolor: (color) => {
+					elm.style.background = color;
+					return elementObject;
+				},
+				backgroundimage: (image) => {
+					elm.style.backgroundImage = `url(${image.replace(/ /g, '%20')})`;
+					// console.log(`url(${image.replace(/ /g, '%20')})`)
+					return elementObject;
+				},
+				backgroundrepeat: (repeat) => {
+					elm.style.backgroundRepeat = repeat;
+					return elementObject;
+				},
+				backgroundposition: (pos) => {
+					elm.style.backgroundRepeat = pos;
+					return elementObject;
+				},
+				backgroundsize: (size) => {
+					elm.style.backgroundSize = size;
+					return elementObject;
+				},
+				backgroundattachment: (attach) => {
+					elm.style.backgroundAttachment = attach;
+					return elementObject;
+				},
+				backgroundclip: (clip) => {
+					elm.style.backgroundClip = cliprepeat;
+					return elementObject;
+				},
+				backgroundorigin: (origin) => {
+					elm.style.backgroundOrigin = origin;
+					return elementObject;
+				},
+				backgroundblend: (mode) => {
+					elm.style.backgroundBlendMode = mode;
+					return elementObject;
+				},
+				backdropfilter: (filter) => {
+					elm.style.backdropFilter = filter;
+					return elementObject;
+				},
+				filter: (filter) => {
+					elm.style.filter = filter;
+					return elementObject;
+				},
+				overflow: (overflow) => {
+					elm.style.overflow = overflow;
+					return elementObject;
+				},
+				overflowx: (overflow) => {
+					elm.style.overflowx = overflow;
+					return elementObject;
+				},
+				overflowy: (overflow) => {
+					elm.style.overflowy = overflow;
+					return elementObject;
+				},
+				scale: (scale) => {
+					elm.style.scale = scale;
+					return elementObject;
+				},
+				clippath: (clip) => {
+					elm.style.clipPath = clip;
+					return elementObject;
+				},
+				source: (srcimg) => {
+					elm.src = srcimg;
+					return elementObject;
+				},
+				src: (srcimg) => {
+					elm.src = srcimg;
+					return elementObject;
+				},
+				width: (width) => {
+					if (elm.tagName === 'IMG' || elm.tagName === 'VIDEO' || elm.tagName === 'CANVAS') {
+						elm.width = width;
+					} else {
+						elm.style.width = width;
+					}
+					return elementObject;
+				},
+
+				height: (height) => {
+					if (elm.tagName === 'IMG' || elm.tagName === 'VIDEO' || elm.tagName === 'CANVAS') {
+						elm.height = height;
+					} else {
+						elm.style.height = height;
+					}
+					return elementObject;
+				},
+				top: (top) => {
+					elm.style.top = top;
+					return elementObject;
+				},
+				left: (left) => {
+					elm.style.left = left;
+					return elementObject;
+				},
+				bottom: (bottom) => {
+					elm.style.bottom = bottom;
+					return elementObject;
+				},
+				right: (right) => {
+					elm.style.right = right;
+					return elementObject;
+				},
+				position: (pos) => {
+					elm.style.position = pos;
+					return elementObject;
+				},
+				padding: (padding) => {
+					elm.style.padding = padding;
+					return elementObject;
+				},
+				paddingtop: (top) => {
+					elm.style.paddingTop = top;
+					return elementObject;
+				},
+				paddingleft: (left) => {
+					elm.style.paddingLeft = left;
+					return elementObject;
+				},
+				paddingbottom: (bottom) => {
+					elm.style.paddingBottom = bottom;
+					return elementObject;
+				},
+				paddingright: (right) => {
+					elm.style.paddingRight = right;
+					return elementObject;
+				},
+				margin: (margin) => {
+					elm.style.margin = margin;
+					return elementObject;
+				},
+				margintop: (top) => {
+					elm.style.marginTop = top;
+					return elementObject;
+				},
+				marginleft: (left) => {
+					elm.style.marginLeft = left;
+					return elementObject;
+				},
+				marginbottom: (bottom) => {
+					elm.style.marginBottom = bottom;
+					return elementObject;
+				},
+				marginright: (right) => {
+					elm.style.marginRight = right;
+					return elementObject;
+				},
+				radius: (radius) => {
+					elm.style.radius = radius;
+					return elementObject;
+				},
+				css: (string) => {
+					elm.style.cssText = string;
+					return elementObject;
+				},
+				// style: (string, overwrite = false) => {
+				// 	const style = document.createElement("style");
+				// 	style.innerHTML = string;
+
+				// 	if (typeof overwrite === 'boolean') {
+				// 		if (overwrite === true) {
 
-                height: (height) => {
-                    if (elm.tagName === 'IMG' || elm.tagName === 'VIDEO' || elm.tagName === 'CANVAS') {
-                        elm.height = height;
-                    } else {
-                        elm.style.height = height;
-                    }
-                    return elementObject;
-                },
-                top: (top) => {
-                    elm.style.top = top;
-                    return elementObject;
-                },
-                left: (left) => {
-                    elm.style.left = left;
-                    return elementObject;
-                },
-                bottom: (bottom) => {
-                    elm.style.bottom = bottom;
-                    return elementObject;
-                },
-                right: (right) => {
-                    elm.style.right = right;
-                    return elementObject;
-                },
-                position: (pos) => {
-                    elm.style.position = pos;
-                    return elementObject;
-                },
-                padding: (padding) => {
-                    elm.style.padding = padding;
-                    return elementObject;
-                },
-                paddingtop: (top) => {
-                    elm.style.paddingTop = top;
-                    return elementObject;
-                },
-                paddingleft: (left) => {
-                    elm.style.paddingLeft = left;
-                    return elementObject;
-                },
-                paddingbottom: (bottom) => {
-                    elm.style.paddingBottom = bottom;
-                    return elementObject;
-                },
-                paddingright: (right) => {
-                    elm.style.paddingRight = right;
-                    return elementObject;
-                },
-                margin: (margin) => {
-                    elm.style.margin = margin;
-                    return elementObject;
-                },
-                margintop: (top) => {
-                    elm.style.marginTop = top;
-                    return elementObject;
-                },
-                marginleft: (left) => {
-                    elm.style.marginLeft = left;
-                    return elementObject;
-                },
-                marginbottom: (bottom) => {
-                    elm.style.marginBottom = bottom;
-                    return elementObject;
-                },
-                marginright: (right) => {
-                    elm.style.marginRight = right;
-                    return elementObject;
-                },
-                radius: (radius) => {
-                    elm.style.radius = radius;
-                    return elementObject;
-                },
-                css: (string) => {
-                    elm.style.cssText = string;
-                    return elementObject;
-                },
-                style: (string) => {
-                    const style = document.createElement("style");
-                    style.innerHTML = string;
-                    document.head.appendChild(style);
-                    return elementObject;
-                },
-                parent: (elementcodename) => {
-                    var parent = document.querySelector(`[codename="${elementcodename}"]`);
-                    if (parent) {
-                        parent.appendChild(elm);  // Append the element to the parent
-                    } else {
-                        console.error(`[AzuOS SDK] Cannot append '${elm.tagName}' element (Codename: '${elementObject.codename}') to "${elementcodename}"`);
-                    }
-                    return elementObject;
-                },
-                window: (windowid) => {
-                    var parentWindow = document.querySelector(`[codename="${windowid}"]`);
-                    if (parentWindow) {
-                        parentWindow.querySelector('.wb-body').appendChild(elm);
-                    } else {
-                        console.error(`[AzuOS SDK] Cannot append '${elm.tagName}' element (Codename: '${elementObject.codename}') to window with codename "${windowid}".`);
-                    }
-                    return elementObject;
-                }
+				// 		}
+				// 	}
+				// 	document.head.appendChild(style);
+				// 	return elementObject;
+				// },
+				style: (string) => {
+					const style = document.createElement("style");
+					style.innerHTML = string;
+					document.head.appendChild(style);
+					return elementObject;
+				},
+				type: (string) => {
+					elm.type = string;
+					return elementObject;
+				},
+				for: (string) => {
+					elm.for = string;
+					return elementObject;
+				},
+				mininput: (number) => {
+					elm.minlength = number;
+					return elementObject;
+				},
+				maxinput: (number) => {
+					elm.maxlength = number;
+					return elementObject;
+				},
+				inputrequired: (boolean) => {
+					if (typeof boolean === 'boolean') {
+						elm.required = boolean;
+					} else if (boolean === 'true') {
+						elm.required = true;
+					} else if (boolean === 'false') {
+						elm.required = false;
+					}
+					return elementObject;
+				},
+				readonly: (boolean) => {
+					if (typeof boolean === 'boolean') {
+						elm.readonly = boolean;
+					} else if (boolean === 'true') {
+						elm.readonly = true;
+					} else if (boolean === 'false') {
+						elm.readonly = false;
+					}
+					return elementObject;
+				},
+				placeholder: (string) => {
+					elm.placeholder = string
+					return elementObject;
+				},
+				placeholder: (string) => {
+					elm.placeholder = string
+					return elementObject;
+				},
+				parent: (elementcodename) => {
+					var parent = document.querySelector(`[codename="${elementcodename}"]`);
+					if (parent) {
+						parent.appendChild(elm);  // Append the element to the parent
+					} else {
+						console.error(`[AzuOS SDK] Cannot append '${elm.tagName}' element (Codename: '${elementObject.codename}') to "${elementcodename}"`);
+					}
+					return elementObject;
+				},
+				window: (windowid) => {
+					var parentWindow = document.querySelector(`[codename="${windowid}"]`);
+					if (parentWindow) {
+						parentWindow.querySelector('.wb-body').appendChild(elm);
+					} else {
+						console.error(`[AzuOS SDK] Cannot append '${elm.tagName}' element (Codename: '${elementObject.codename}') to window with codename "${windowid}".`);
+					}
+					return elementObject;
+				}
 			};
-            elm.setAttribute("codename", codename);
+			elm.setAttribute("codename", codename);
 			resolve(elementObject);
 		});
 	}
 };
 
 const system = {
-    version: () => {
-        return 8;
-    },
-    name: () => {
-        return "AzuOS";
-    },
-    copyright: () => {
-        return "Copyright @ AzuSystem 2024";
-    },
-    maker: () => {
-        return "AzuSystem";
-    }
-}
\ No newline at end of file
+	version: () => {
+		return 8;
+	},
+	name: () => {
+		return "AzuOS";
+	},
+	copyright: () => {
+		return "Copyright @ AzuSystem 2024";
+	},
+	maker: () => {
+		return "AzuSystem";
+	}
+}