feat: Integrate date in task bar

- Date format can now be changed dynamically
- Date element is now created in task bar class
- Class can accept options, currently only for date
- Date format is changed according to position
- Changed dom structure for clock
- Refactor setPosition method to be more flexible
- Changed flex style for task bar items to inherit the direction

source/style/modules/ui/_windows_module.scss

@@ -25,13 +25,45 @@ $padding_half: calc(#{hippie.$space_half} - 3px) hippie.$space_half;
 	padding: hippie.$space_basic;
 	background-color: rgba(0, 0, 0, .1);
 
+	&.top,
+	&.bottom {
+		nav,
+		& > div {
+			&:last-child {
+				margin-top: unset;
+				margin-left: auto;
+			}
+		}
+
+		.clock {
+			text-align: end;
+		}
+	}
+
+	&.right,
+	&.left {
+		nav,
+		& > div {
+			&:last-child {
+				margin-top: auto;
+				margin-left: unset;
+			}
+		}
+
+		.clock {
+			text-align: center;
+
+			& > span {
+				display: inline-block;
+				word-wrap: anywhere;
+			}
+		}
+	}
+
 	nav,
 	& > div {
 		@extend %flex-bar;
-
-		&:last-child {
-			margin-left: auto;
-		}
+		flex-direction: inherit;
 	}
 
 	button {
@@ -70,8 +102,6 @@ $padding_half: calc(#{hippie.$space_half} - 3px) hippie.$space_half;
 	}
 
 	.clock {
-		text-align: end;
-
 		&,
 		& > * {
 			line-height: 1;