@ozdao/prometheus-framework 0.2.30 → 0.2.32

package/src/styles/components/input.scss

@@ -1,319 +0,0 @@
-.input-text-label {
-	display: block;
-	width: 100%;
-
-	input, select, textarea {
-		display: block;
-		position: relative;
-
-		width: 100%;
-		// height: 3rem;
-		
-    padding-left: 1rem;
-		
-		font-size: 0.875rem;
-		font-weight: 300;
-
-		z-index: 4;
-		
-		border: 0;
-		background: #F7F7F7;
-
-		width: 100%;
-	}
-}
-
-.input {
-	display: block;
-	position: relative;
-
-	background: white;
-	border: none;
-
-	border-radius: 0.5rem;
-
-
-	&-select {
-
-		&:hover {
-			cursor: pointer;
-		}
-
-		&:focus {
-			outline: none;
-			box-shadow: 0 0 1px 1px rgba(var(--main),0.33);
-		}
-	}
-
-	&-text {
-		width: 100%;
-		height: 3rem;
-		
-    padding-left: 1rem;
-		
-		font-size: 1.125rem;
-		font-weight: 300;
-
-		z-index: 4;
-
-		&:focus {
-			outline: none;
-			box-shadow: 0 0 1px 1px rgba(var(--main),0.33);
-		}
-	}
-
-	&-textarea {
-		min-height: 3rem;	
-
-		resize: vertical;
-		height: auto;
-	}
-
-
-	.input-status {
-		display: block;
-		position: absolute;
-
-		right: 1.5rem;
-		top: calc(50% - 0.75rem);
-
-		width: 1.5rem;
-		height: 1.5rem;
-
-		border-radius: 1.5rem;
-
-		background: red;
-
-		z-index: 5;
-	}
-}
-
-
-.input-textarea  {
-	padding-left: 1rem;
-	padding-top: 1rem;
-	font-size: .875rem;
-	font-weight: 300;
-	z-index: 4;
-	border: 0;
-	background: #F7F7F7;
-	width: 100%;
-}
-
-.input-description {
-	word-break: break-word;
-	min-height: 6rem;
-	padding-top: 1rem;
-}
-
-.input-price {
-	display: flex;
-	position: relative;
-
-	width: 100%;
-
-	.input-label {
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		position: relative;
-
-		width: 4rem;
-
-		background: red;
-
-		background: #F7F7F7;
-		border-right: 1px solid rgba(0,0,0,0.1);
-		border-radius: 0.5rem;
-
-		border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-
-		
-		left: 0;
-		top: 0;
-
-		z-index: 5
-	}
-
-	input  {
-		width: 100%; 
-		border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-		z-index: 4;
-	}
-}
-
-
-
-.input-small {
-	padding: 0.375rem;
-	width: 100%;
-	height: 2rem;
-}
-
-.input-radio-label {
-	display: flex;
-	width: 100%;
-	font-size: 0.875rem;
-	background: #f7f7f7;
-	border-radius: 0.5rem;
-	padding: 1rem;
-
-	.round {
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		width: 1.5rem;
-		height: 1.5rem;
-
-		border-radius: 10rem;
-		background: #D3D3D3;
-
-		margin-right: 1rem;
-
-		div {
-			width: 0.5rem;
-			height: 0.5rem;
-
-			border-radius: 10rem;
-			background: white;
-
-		}
-	}
-}
-
-
-
-.input-checkbox {
-	position: relative;
-	width: 1.5rem;
-	height: 1.5rem;
-
-	border-radius: 0.5rem;
-	overflow: hidden;
-	
-	img { 
-		position: absolute;
-
-		height: 75%;
-		width: 75%;
-
-		left: calc(50% - 37.5%);
-		top: calc(50% - 37.5%);
-
-		z-index: 2;
-	}
-	input {
-		height: 100%;
-		width: 100%;
-
-		margin: 0;
-
-		border: none;
-		border-radius: 0.5rem;
-
-		background: white;
-
-		z-index: 1;
-	}
-}
-
-/* 1. Default input */
-.input-default {
-  background-color: #f2f2f2;
-  border-radius: 20px;
-  border: none;
-  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.1);
-  padding: 10px;
-  font-size: 16px;
-  color: #333;
-}
-
-/* 2. Neon input */
-.input-neon {
-  background-color: #1f1f1f;
-  border-radius: 10px;
-  border: none;
-  box-shadow: 0 0 10px #ff00f7, inset 0 0 5px rgba(0, 0, 0, 0.1);
-  padding: 10px;
-  font-size: 16px;
-  color: #fff;
-}
-
-/* 3. Gradient input */
-.input-gradient {
-  background-image: linear-gradient(120deg, #f6d365 0%, #fda085 100%);
-  border-radius: 20px;
-  border: none;
-  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
-  padding: 10px;
-  font-size: 16px;
-  color: #fff;
-}
-
-/* 4. Flat input */
-.input-flat {
-  background-color: #fff;
-  border-radius: 0px;
-  border: none;
-  box-shadow: none;
-  border-bottom: 2px solid #ccc;
-  padding: 10px;
-  font-size: 16px;
-  color: #333;
-}
-
-/* 5. Glass input */
-.input-glass {
-  background-color: rgba(255, 255, 255, 0.5);
-  border-radius: 20px;
-  border: none;
-  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
-  padding: 10px;
-  font-size: 16px;
-  color: #333;
-}
-
-/* 6. Soft input */
-.input-soft {
-  background-color: #fff;
-  border-radius: 20px;
-  border: none;
-  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
-  padding: 10px;
-  font-size: 16px;
-  color: #333;
-}
-
-/* 7. Underline input */
-.input-underline {
-  background-color: transparent;
-  border-radius: 0px;
-  border: none;
-  box-shadow: none;
-  border-bottom: 2px solid #ccc;
-  padding: 10px;
-  font-size: 16px;
-  color: #333;
-}
-
-/* 8. Futuristic input */
-.input-futuristic {
-  background-color: rgba(0, 0, 0, 0.5);
-  border-radius: 50px;
-  border: none;
-  box-shadow: 0px 0px 20px #00ff6a;
-  padding: 15px;
-  font-size: 16px;
-  color: #fff;
-}
-
-/* 9. Gradient underline input */
-.input-gradient-underline {
-  background-color: transparent;
-  border-radius: 0px;
-  border: none;
-  box-shadow: none;
-  border-bottom: 2px solid #f21
-}