Merge pull request #19 from Ulleri-Tech/Style-fixes

style fixes

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@ulleritech/nepali-date-picker",
-	"version": "0.3.1",
+	"version": "0.3.3",
 	"description": "Nepali Date Picker",
 	"author": {
 		"name": "Ulleri Tech",

src/lib/Calendar.svelte

@@ -142,11 +142,12 @@
 		font-size: 0.875rem;
 		line-height: 1.25rem;
 		padding: 0.5rem;
+		margin-top: 0.25rem;
 	}
 	.header {
 		display: flex;
 		width: 100%;
-		padding: 0.5rem 0.5rem 0rem 0.5rem;
+		padding: 0.5rem 0rem 0rem 0rem;
 		justify-content: space-between;
 	}
 	.header-wrapper {

src/lib/NepaliDatePicker.svelte

@@ -90,7 +90,6 @@
 			margin: 0;
 			font: inherit;
 			cursor: pointer;
-			outline: inherit;
 		}
 
 		body,
@@ -148,7 +147,6 @@
 		display: flex;
 		flex-direction: column;
 		background-color: white;
-		gap: 0.25rem;
 	}
 	.date-label {
 		text-align: left;
@@ -158,12 +156,12 @@
 	}
 	.date-select-box {
 		display: flex;
-		padding-left: 0.25rem;
+
 		justify-content: center;
 		align-items: center;
-		height: 2.25rem;
+		height: 2.5rem;
 		background-color: white;
-		border: 0.5px solid #6b7280;
+		outline: 0.5px solid #6b7280;
 	}
 	.date-icon {
 		padding-right: 0.75rem;

src/lib/ShiftMonth.svelte

@@ -31,7 +31,7 @@
 </script>
 
 <div>
-	<button type="button" on:click={previousMonth} aria-label="calendar backward">
+	<button class="chevron" type="button" on:click={previousMonth} aria-label="calendar backward">
 		<svg
 			xmlns="http://www.w3.org/2000/svg"
 			class="icon icon-tabler icon-tabler-chevron-left"
@@ -49,7 +49,7 @@
 		</svg>
 	</button>
 
-	<button type="button" on:click={nextMonth} aria-label="calendar forward">
+	<button type="button" on:click={nextMonth} aria-label="calendar forward" class="chevron">
 		<svg
 			xmlns="http://www.w3.org/2000/svg"
 			class="icon icon-tabler icon-tabler-chevron-right"
@@ -67,3 +67,12 @@
 		</svg>
 	</button>
 </div>
+
+<style>
+	.chevron:hover {
+		color: gray;
+	}
+	.chevron:disabled {
+		color: gray;
+	}
+</style>