diff --git a/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_common.scss b/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_common.scss
index 5305c161..ba476a67 100644
--- a/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_common.scss
+++ b/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_common.scss
@@ -1,4 +1,4 @@
-//general
+/* general */
 $fontSize: 14px !default;
 $fontFamily: 'Ubuntu' !default;
 $borderRadius: 5px !default;
diff --git a/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_light.scss b/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_light.scss
index cb4a8316..91203afa 100644
--- a/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_light.scss
+++ b/libs/portal-layout-styles/src/styles/primeng/sass/variables/layout/_layout_light.scss
@@ -43,7 +43,7 @@ $topbarItemTextHoverBgColor: rgba(255, 255, 255, 0.12);
 :root {
   --divider-color: #{$dividerColor};
 
-  // --changes onecx
+  /* --changes onecx */
 
   --topbar-bg-color: #{$topbarBgColor};
   --topbar-text-color: #{$topbarItemTextColor};
@@ -55,7 +55,7 @@ $topbarItemTextHoverBgColor: rgba(255, 255, 255, 0.12);
 
   --topbar-menu-button-bg-color: #{$topbarMenuButtonBgColor};
   --menu-button-text-color: #{$topbarMenuButtonTextColor};
-  // end header custom vars
+  /* end header custom vars */
 
   --body-bg-color: #{$bodyBgColor};
   --text-color: #{$textColor};
@@ -68,7 +68,7 @@ $topbarItemTextHoverBgColor: rgba(255, 255, 255, 0.12);
   --hover-bg-color: #{$hoverBgColor};
   --solid-surface-text-color: #{$solidSurfaceTextColor};
 
-  // --end changes onecx
+  /* --end changes onecx */
 }
 
 @import './_layout_common';
diff --git a/libs/portal-layout-styles/src/styles/primeng/sass/variables/theme/_theme_light.scss b/libs/portal-layout-styles/src/styles/primeng/sass/variables/theme/_theme_light.scss
index 5e56ea14..ea792406 100644
--- a/libs/portal-layout-styles/src/styles/primeng/sass/variables/theme/_theme_light.scss
+++ b/libs/portal-layout-styles/src/styles/primeng/sass/variables/theme/_theme_light.scss
@@ -18,7 +18,7 @@ $emphasis-low: rgba(0, 0, 0, 0.38);
 $emphasis-lower: rgba(0, 0, 0, 0.12);
 $overlayColor: #000000;
 
-//global
+/*  global */
 $fontFamily: Ubuntu, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif;
 $fontSize: 1rem;
 $fontWeight: normal;
@@ -38,16 +38,16 @@ $maskBg: rgba(0, 0, 0, 0.32);
 $loadingIconFontSize: 2rem;
 $errorColor: #b00020;
 
-//selected state
+/* selected state */
 $highlightBg: rgba($primaryColor, 0.12);
 $highlightTextColor: $primaryColor;
 $highlightFocusBg: rgba($primaryColor, 0.24) !default;
 
-//scale
+/* scale */
 $scaleSM: 0.875;
 $scaleLG: 1.25;
 
-//focus
+/* focus */
 $focusOutlineColor: transparent;
 $focusOutline: 0 none;
 $focusOutlineOffset: 0;
@@ -55,7 +55,7 @@ $focusShadow: none;
 $focusOutlineCustom: 1px solid var(--primary-color);
 $focusOutlineOffsetCustom: 2px;
 
-//action icons
+/* action icons */
 $actionIconWidth: 2.5rem;
 $actionIconHeight: 2.5rem;
 $actionIconBg: transparent;
@@ -68,7 +68,7 @@ $actionIconBorderRadius: 50%;
 $actionIconFocusOutline: $focusOutlineCustom;
 $actionIconFocusOutlineOffset: 0px;
 
-//input field (e.g. inputtext, spinner, inputmask)
+/* input field (e.g. inputtext, spinner, inputmask) */
 $inputPadding: 1rem 1rem;
 $inputTextFontSize: 1rem;
 $inputBg: #ffffff;
@@ -83,12 +83,12 @@ $inputFilledBg: #f5f5f5;
 $inputFilledHoverBg: #ececec;
 $inputFilledFocusBg: #dcdcdc;
 
-//input groups
+/* input groups */
 $inputGroupBg: $inputBg;
 $inputGroupTextColor: $emphasis-medium;
 $inputGroupAddOnMinWidth: 2.357rem;
 
-//input lists (e.g. dropdown, autocomplete, multiselect, orderlist)
+/* input lists (e.g. dropdown, autocomplete, multiselect, orderlist) */
 $inputListBg: #ffffff;
 $inputListTextColor: $textColor;
 $inputListBorder: $inputBorder;
@@ -110,28 +110,28 @@ $inputListHeaderBorder: 1px solid rgba(0, 0, 0, 0.12);
 $inputListItemTextFocusColor: $textColor;
 $inputListItemFocusBg: #e2e8f0 !default;
 
-//inputs with overlays (e.g. autocomplete, dropdown, multiselect)
+/* inputs with overlays (e.g. autocomplete, dropdown, multiselect) */
 $inputOverlayBg: $inputListBg;
 $inputOverlayHeaderBg: $inputListHeaderBg;
 $inputOverlayBorder: 0 none;
 $inputOverlayShadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14),
   0 3px 14px 2px rgba(0, 0, 0, 0.12);
 
-//multiselect
+/* multiselect */
 $multiSelectCloseIconFocusOutline: $focusOutlineCustom;
 $multiSelectCloseIconFocusOutlineOffset: $focusOutlineOffset;
 
-//chip
+/* chip */
 $chipRemoveIconFocusOutline: $focusOutlineCustom;
 $chipRemoveIconFocusOutlineOffset: $focusOutlineOffset;
 
-//password
+/* password */
 $passwordMeterBg: rgba($primaryColor, 0.32);
 $passwordWeakBg: #d32f2f;
 $passwordMediumBg: #fbc02d;
 $passwordStrongBg: #689f38;
 
-//button
+/* button */
 $buttonPadding: 0.714rem 1rem;
 $buttonIconOnlyWidth: 3rem;
 $buttonIconOnlyPadding: 0.714rem;
@@ -239,7 +239,7 @@ $linkButtonHoverColor: $primaryColor;
 $linkButtonTextHoverDecoration: underline;
 $linkButtonFocusShadow: none;
 
-//checkbox
+/* checkbox */
 $checkboxWidth: 18px;
 $checkboxHeight: 18px;
 $checkboxBorder: 2px solid #757575;
@@ -251,7 +251,7 @@ $checkboxActiveHoverBg: $primaryColor;
 $checkboxIconActiveHoverColor: $primaryTextColor;
 $checkboxActiveHoverBorderColor: $primaryColor;
 
-//radiobutton
+/* radiobutton */
 $radiobuttonWidth: 20px;
 $radiobuttonHeight: 20px;
 $radiobuttonBorder: 2px solid #757575;
@@ -263,7 +263,7 @@ $radiobuttonActiveHoverBg: $primaryTextColor;
 $radiobuttonIconActiveHoverColor: $primaryColor;
 $radiobuttonActiveHoverBorderColor: $primaryColor;
 
-//colorpicker
+/* colorpicker */
 $colorPickerPreviewWidth: 2rem;
 $colorPickerPreviewHeight: 2rem;
 $colorPickerBg: #323232;
@@ -271,7 +271,7 @@ $colorPickerBorderColor: #191919;
 $colorPickerBorder: 1px solid #191919 !default;
 $colorPickerHandleColor: #ffffff;
 
-//togglebutton
+/* togglebutton */
 $toggleButtonBg: #ffffff;
 $toggleButtonBorder: 1px solid rgba(0, 0, 0, 0.12);
 $toggleButtonTextColor: $textColor;
@@ -289,12 +289,12 @@ $toggleButtonActiveHoverBorderColor: #d9d8d9;
 $toggleButtonTextActiveHoverColor: $textColor;
 $toggleButtonIconActiveHoverColor: $textSecondaryColor;
 
-//inplace
+/* inplace */
 $inplacePadding: $inputPadding;
 $inplaceHoverBg: rgba(0, 0, 0, 0.04);
 $inplaceTextHoverColor: $textColor;
 
-//rating
+/* rating */
 $ratingIconFontSize: 1.143rem;
 $ratingCancelIconColor: #b00020;
 $ratingCancelIconHoverColor: #b00020;
@@ -302,7 +302,7 @@ $ratingStarIconOffColor: $primaryColor;
 $ratingStarIconOnColor: $primaryColor;
 $ratingStarIconHoverColor: $primaryColor;
 
-//slider
+/* slider */
 $sliderBg: #c1c1c1;
 $sliderBorder: 0 none;
 $sliderHorizontalHeight: 2px;
@@ -316,7 +316,7 @@ $sliderHandleHoverBorderColor: 0 none;
 $sliderHandleHoverBg: $primaryColor;
 $sliderRangeBg: $primaryColor;
 
-//calendar
+/* calendar */
 $calendarTableMargin: 0.5rem 0;
 $calendarPadding: 0.5rem;
 $calendarBg: #ffffff;
@@ -354,7 +354,7 @@ $calendarCellDatePaddingSM: 0;
 $calendarFocusOutline: $focusOutlineCustom;
 $calendarFocusOutlineOffset: $focusOutlineOffset;
 
-//input switch
+/* input switch */
 $inputSwitchWidth: 2.75rem;
 $inputSwitchHeight: 1rem;
 $inputSwitchBorderRadius: 0.5rem;
@@ -369,7 +369,7 @@ $inputSwitchSliderOnBg: rgba($primaryColor, 0.5);
 $inputSwitchSliderOnHoverBg: rgba($primaryColor, 0.5);
 $inputSwitchHandleOnBg: $primaryColor;
 
-//panel
+/* panel */
 $panelHeaderBorderColor: #e0e0e0 !default;
 $panelHeaderBorder: 1px solid #e0e0e0;
 $panelHeaderBg: #ffffff;
@@ -393,7 +393,7 @@ $panelFooterBg: #ffffff;
 $panelFooterTextColor: $textColor;
 $panelFooterPadding: 1rem 1rem;
 
-//accordion
+/* accordion */
 $accordionSpacing: 0;
 $accordionHeaderBorder: 0 none;
 $accordionHeaderBg: #ffffff;
@@ -418,7 +418,7 @@ $accordionContentBg: #ffffff;
 $accordionContentTextColor: $textColor;
 $accordionContentPadding: 1rem 1.5rem;
 
-//tabview
+/* tabview */
 $tabviewNavBorder: solid rgba(0, 0, 0, 0.12);
 $tabviewNavBorderWidth: 0 0 1px 0;
 $tabviewNavBg: #ffffff;
@@ -446,15 +446,15 @@ $tabviewContentBg: #ffffff;
 $tabviewContentTextColor: $textColor;
 $tabviewContentPadding: $panelContentPadding;
 
-//upload
+/* upload */
 $fileUploadProgressBarHeight: 4px;
 $fileUploadContentPadding: 2rem 1rem;
 
-//scrollpanel
+/* scrollpanel */
 $scrollPanelTrackBorder: 0 none;
 $scrollPanelTrackBg: rgba(0, 0, 0, 0.12);
 
-//card
+/* card */
 $cardBodyPadding: 1rem;
 $cardTitleFontSize: 1.5rem;
 $cardTitleFontWeight: 700;
@@ -464,7 +464,7 @@ $cardContentPadding: 1rem 0;
 $cardFooterPadding: 1rem 0 0 0;
 $cardShadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
 
-//editor
+/* editor */
 $editorToolbarBg: $panelHeaderBg;
 $editorToolbarBorder: $panelHeaderBorder;
 $editorToolbarPadding: $panelHeaderPadding;
@@ -474,7 +474,7 @@ $editorIconActiveColor: $primaryColor;
 $editorContentBorder: $panelContentBorder;
 $editorContentBg: $panelContentBg;
 
-//paginator
+/* paginator */
 $paginatorBg: #ffffff;
 $paginatorTextColor: $textColor;
 $paginatorBorder: solid #e4e4e4;
@@ -494,7 +494,7 @@ $paginatorElementPadding: 0;
 $paginatorFocusOutline: $focusOutlineCustom;
 $paginatorFocusOutlineOffset: 0;
 
-//table
+/* table */
 $tableHeaderBorder: 1px solid #e4e4e4;
 $tableHeaderBorderWidth: 0 0 1px 0;
 $tableHeaderBg: #ffffff;
@@ -549,29 +549,29 @@ $tableBottomPaginatorBorderWidth: 0 0 1px 0;
 $tableScaleSM: 0.5;
 $tableScaleLG: 1.25;
 
-//dataview
+/* dataview */
 $dataViewContentPadding: 1rem 0;
 $dataViewContentBorder: 0 none;
 $dataViewListItemBorder: solid rgba(0, 0, 0, 0.12);
 $dataViewListItemBorderWidth: 0 0 1px 0;
 
-//orderlist, picklist
+/* orderlist, picklist */
 $orderListBreakpoint: 769px;
 $pickListBreakpoint: 769px;
 
-//schedule
+/* schedule */
 $fullCalendarEventBg: $highlightBg;
 $fullCalendarEventBorderColor: $highlightBg !default;
 $fullCalendarEventBorder: 1px solid $highlightBg;
 $fullCalendarEventTextColor: $highlightTextColor;
 
-//tree
+/* tree */
 $treeNodePadding: 0.25rem;
 $treeNodeContentPadding: 0.75rem;
 $treeNodeChildrenPadding: 0 0 0 1rem;
 $treeNodeIconColor: $textSecondaryColor;
 
-//timeline
+/* timeline */
 $timelineVerticalEventContentPadding: 0 1rem !default;
 $timelineHorizontalEventContentPadding: 1rem 0 !default;
 $timelineEventMarkerWidth: 1rem !default;
@@ -582,10 +582,10 @@ $timelineEventMarkerBackground: #bdbdbd !default;
 $timelineEventConnectorSize: 2px !default;
 $timelineEventColor: #bdbdbd !default;
 
-//org chart
+/* org chart */
 $organizationChartConnectorColor: rgba(0, 0, 0, 0.12);
 
-//message
+/* message */
 $messageMargin: 1rem 0;
 $messagePadding: 1.25rem 1.5rem;
 $messageBorderWidth: 0 0 0 0;
@@ -593,14 +593,14 @@ $messageIconFontSize: 1.5rem;
 $messageTextFontSize: 1rem;
 $messageTextFontWeight: 500;
 
-//inline message
+/* inline message */
 $inlineMessagePadding: $inputPadding;
 $inlineMessageMargin: 0;
 $inlineMessageIconFontSize: 1rem;
 $inlineMessageTextFontSize: 1rem;
 $inlineMessageBorderWidth: 1px;
 
-//toast
+/* toast */
 $toastIconFontSize: 2rem;
 $toastMessageTextMargin: 0 0 0 1rem;
 $toastMargin: 0 0 1rem 0;
@@ -611,7 +611,7 @@ $toastOpacity: 0.9;
 $toastTitleFontWeight: 700;
 $toastDetailMargin: $inlineSpacing 0 0 0;
 
-//severities
+/* severities */
 $infoMessageBg: #b3e5fc;
 $infoMessageBorder: solid transparent;
 $infoMessageTextColor: #01579b;
@@ -629,13 +629,13 @@ $errorMessageBorder: solid transparent;
 $errorMessageTextColor: #b71c1c;
 $errorMessageIconColor: #b71c1c;
 
-//overlays
+/* overlays */
 $overlayContentBorder: 0 none;
 $overlayContentBg: $panelContentBg;
 $overlayContainerShadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14),
   0 9px 46px 8px rgba(0, 0, 0, 0.12);
 
-//dialog
+/* dialog */
 $dialogHeaderBg: #ffffff;
 $dialogHeaderBorder: 0 none;
 $dialogHeaderTextColor: $textColor;
@@ -648,12 +648,12 @@ $dialogFooterPadding: 1rem 1.5rem;
 $dialogHeaderIconFocusOutline: $focusOutlineCustom;
 $dialogHeaderIconFocusOutlineOffset: $focusOutlineOffset;
 
-//tooltip
+/* tooltip */
 $tooltipBg: rgba(97, 97, 97, 0.9);
 $tooltipTextColor: #ffffff;
 $tooltipPadding: 0.5rem;
 
-//steps
+/* steps */
 $stepsItemBg: transparent;
 $stepsItemBorder: 1px solid transparent;
 $stepsItemTextColor: $textColor;
@@ -664,14 +664,14 @@ $stepsItemNumberColor: $textColor;
 $stepsItemNumberBorderRadius: 50%;
 $stepsItemActiveFontWeight: 500;
 
-//progressbar
+/* progressbar */
 $progressBarHeight: 4px;
 $progressBarBorder: 0 none;
 $progressBarBg: rgba($primaryColor, 0.32);
 $progressBarValueBg: $primaryColor;
 $progressBarValueTextColor: $primaryTextColor !default;
 
-//menu (e.g. menu, menubar, tieredmenu)
+/* menu (e.g. menu, menubar, tieredmenu) */
 $menuWidth: 12.5rem;
 $menuBg: #ffffff;
 $menuBorder: 1px solid #e5e5e5;
@@ -702,7 +702,7 @@ $verticalMenuitemMargin: 0;
 $verticalMenuPadding: 0.5rem 1.25rem;
 $menuSeparatorMargin: 0.5rem 0;
 
-// panel menu
+/*  panel menu */
 $panelMenuHeaderBorder: 0 none;
 $panelMenuHeaderBg: #ffffff;
 $panelMenuHeaderPadding: 1rem;
@@ -716,7 +716,7 @@ $panelMenuSpacing: 0;
 
 $breadcrumbPadding: 1rem;
 $breadcrumbBg: #ffffff;
-// $breadcrumbBorder:1px solid #e5e5e5;
+/*  $breadcrumbBorder:1px solid #e5e5e5; */
 $breadcrumbBorder: none;
 $breadcrumbItemTextColor: $textColor;
 $breadcrumbItemIconColor: $textSecondaryColor;
@@ -741,7 +741,7 @@ $horizontalMenuRootMenuitemTextActiveColor: $textColor;
 $horizontalMenuRootMenuitemIconActiveColor: $textSecondaryColor;
 $horizontalMenuRootMenuitemActiveBg: rgba(0, 0, 0, 0.04);
 
-//badge and tag
+/* badge and tag */
 $badgeBg: $primaryColor;
 $badgeTextColor: $primaryTextColor;
 $badgeMinWidth: 1.5rem;
@@ -751,7 +751,7 @@ $badgeFontSize: 0.75rem;
 
 $tagPadding: 0.25rem 0.4rem;
 
-//carousel
+/* carousel */
 $carouselIndicatorsPadding: 1rem;
 $carouselIndicatorBg: #dcdcdc;
 $carouselIndicatorHoverBg: #ececec;
@@ -759,7 +759,7 @@ $carouselIndicatorBorderRadius: 0;
 $carouselIndicatorWidth: 2rem;
 $carouselIndicatorHeight: 0.5rem;
 
-//galleria
+/* galleria */
 $galleriaMaskBg: rgba(0, 0, 0, 0.9);
 $galleriaCloseIconMargin: 0.5rem;
 $galleriaCloseIconFontSize: 2rem;
@@ -805,7 +805,7 @@ $galleriaThumbnailNavigatorBorderRadius: 50%;
 $galleriaThumbnailNavigatorWidth: 2rem;
 $galleriaThumbnailNavigatorHeight: 2rem;
 
-//divider
+/* divider */
 $dividerHorizontalMargin: 1.25rem 0;
 $dividerHorizontalPadding: 0 1.25rem;
 $dividerVerticalMargin: 0 1.25rem;
@@ -813,18 +813,18 @@ $dividerVerticalPadding: 1.25rem 0;
 $dividerSize: 1px;
 $dividerColor: rgba(0, 0, 0, 0.12);
 
-//avatar
+/* avatar */
 $avatarBg: rgba(0, 0, 0, 0.12);
 $avatarTextColor: $textColor;
 
-//chip
+/* chip */
 $chipBg: rgba(0, 0, 0, 0.12);
 $chipTextColor: $textColor;
 $chipBorderRadius: 16px;
 $chipFocusBg: #e2e8f0 !default;
 $chipFocusTextColor: $textColor;
 
-//scrollTop
+/* scrollTop */
 $scrollTopBg: $accentColor;
 $scrollTopHoverBg: rgba($accentColor, 0.92);
 $scrollTopWidth: 3rem;
@@ -833,15 +833,15 @@ $scrollTopBorderRadius: 50%;
 $scrollTopFontSize: 1.5rem;
 $scrollTopTextColor: $accentTextColor;
 
-//skeleton
+/* skeleton */
 $skeletonBg: rgba(0, 0, 0, 0.08);
 $skeletonAnimationBg: rgba(255, 255, 255, 0.4);
 
-//splitter
+/* splitter */
 $splitterGutterBg: rgba(0, 0, 0, 0.04);
 $splitterGutterHandleBg: rgba(0, 0, 0, 0.12);
 
-//speeddial
+/* speeddial */
 $speedDialButtonWidth: 4rem !default;
 $speedDialButtonHeight: 4rem !default;
 $speedDialButtonIconFontSize: 2rem !default;
@@ -852,7 +852,7 @@ $speedDialActionHoverBg: rgba($accentColor, 0.92) !default;
 $speedDialActionTextColor: #fff !default;
 $speedDialActionTextHoverColor: #fff !default;
 
-//dock
+/* dock */
 $dockActionWidth: 4rem !default;
 $dockActionHeight: 4rem !default;
 $dockItemPadding: 0.5rem !default;
@@ -864,7 +864,7 @@ $dockBorder: 1px solid rgba(255, 255, 255, 0.2) !default;
 $dockPadding: 0.5rem 0.5rem !default;
 $dockBorderRadius: 0.5rem !default;
 
-//image
+/* image */
 $imageMaskBg: rgba(0, 0, 0, 0.9) !default;
 $imagePreviewToolbarPadding: 1rem !default;
 $imagePreviewIndicatorColor: #f8f9fa !default;
diff --git a/libs/portal-layout-styles/src/styles/shell/_fonts.scss b/libs/portal-layout-styles/src/styles/shell/_fonts.scss
index 2c645355..a2cc8cb1 100644
--- a/libs/portal-layout-styles/src/styles/shell/_fonts.scss
+++ b/libs/portal-layout-styles/src/styles/shell/_fonts.scss
@@ -1,6 +1,3 @@
-/* roboto-flex and ubuntu */
-// @import url('https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100;8..144,400;8..144,500;8..144,700&family=Ubuntu:wght@300;400;500;700&display=swap');
-
 @font-face {
     font-family: 'Ubuntu';
     font-style: normal;
diff --git a/libs/portal-layout-styles/src/styles/shell/_footer.scss b/libs/portal-layout-styles/src/styles/shell/_footer.scss
index 31ea45f7..31138d0a 100644
--- a/libs/portal-layout-styles/src/styles/shell/_footer.scss
+++ b/libs/portal-layout-styles/src/styles/shell/_footer.scss
@@ -1,5 +1,5 @@
 .layout-footer {
-  // background-color: $contentBgColor;
   color: var(--footer-text-color);
+  /* background-color: $contentBgColor; */
   background-color: var(--footer-bg-color);
 }
diff --git a/libs/portal-layout-styles/src/styles/shell/_validation.scss b/libs/portal-layout-styles/src/styles/shell/_validation.scss
index 8e4139c6..1c902ff2 100644
--- a/libs/portal-layout-styles/src/styles/shell/_validation.scss
+++ b/libs/portal-layout-styles/src/styles/shell/_validation.scss
@@ -1,4 +1,4 @@
-// default error class used by @ngneat/error-tailor
+/* default error class used by @ngneat/error-tailor */
 label.control-error {
   color: var(--error-color);
   font-size: smaller;
diff --git a/libs/portal-layout-styles/src/styles/shell/_variables.scss b/libs/portal-layout-styles/src/styles/shell/_variables.scss
index 094bc49a..b87d0f17 100644
--- a/libs/portal-layout-styles/src/styles/shell/_variables.scss
+++ b/libs/portal-layout-styles/src/styles/shell/_variables.scss
@@ -1,16 +1,16 @@
-// Body Colors and other specifications
+/* Body Colors and other specifications */
 $letterSpacing: normal !default;
 
-// Menu Colors and Shadows
+/* Menu Colors and Shadows */
 $menuShadow: 2px 0 4px -1px rgba(0, 0, 0, 0.2), 4px 0 5px 0 rgba(0, 0, 0, 0.14), 1px 0 10px 0 rgba(0, 0, 0, 0.12);
 $submenuShadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
 
-// Animation
+/* Animation */
 $animationTimingFunction: cubic-bezier(0.05, 0.74, 0.2, 0.99) !default;
 $mobileBreakpoint: 991px !default;
 $smallScreenBreakpoint: 576px !default;
 
-// Headings
+/* Headings */
 $h1FontSize: 2.5rem;
 $h2FontSize: 2rem;
 $h3FontSize: 1.75rem;
@@ -18,7 +18,7 @@ $h4FontSize: 1.5rem;
 $h5FontSize: 1.25rem;
 $h6FontSize: 1rem;
 
-// General Colors
+/* General Colors */
 $pink: #e91e63 !default;
 $indigo: #3f51b5 !default;
 $yellow: #ffc107 !default;
diff --git a/libs/portal-layout-styles/src/styles/shell/menu/_menu_common.scss b/libs/portal-layout-styles/src/styles/shell/menu/_menu_common.scss
index 63ab9d6a..304c7932 100644
--- a/libs/portal-layout-styles/src/styles/shell/menu/_menu_common.scss
+++ b/libs/portal-layout-styles/src/styles/shell/menu/_menu_common.scss
@@ -24,7 +24,7 @@
       padding-bottom: 2rem;
 
       li {
-        // border-radius: 4px;
+        /* border-radius: 4px; */
 
         &.layout-root-menuitem {
           > a {
diff --git a/libs/portal-layout-styles/src/styles/shell/menu/_menu_theme.scss b/libs/portal-layout-styles/src/styles/shell/menu/_menu_theme.scss
index 78a6c732..52a5810c 100644
--- a/libs/portal-layout-styles/src/styles/shell/menu/_menu_theme.scss
+++ b/libs/portal-layout-styles/src/styles/shell/menu/_menu_theme.scss
@@ -10,26 +10,28 @@
             color: var(--menu-text-color);
           }
         }
-
-        // > ul {
-        //   background-color: var(--menu-bg-color);
-        // }
+/*
+        > ul {
+          background-color: var(--menu-bg-color);
+        }
+*/
       }
 
       li {
         border-left: 0px;
         &.active-menu-parent.parent-menu {
-          // background: #ececec;
+          /* background: #ececec; */
           border-left: 4px solid var(--primary-color);
         }
 
         a {
           color: var(--menu-item-text-color);
           border-left: 4px solid transparent;
-          // i {
-          //   color: var(--menu-item-text-color);
-          // }
-
+/*
+          i {
+            color: var(--menu-item-text-color);
+          }
+*/
           &:hover {
             background-color: var(--menu-item-hover-bg-color);
           }
@@ -46,10 +48,11 @@
             color: var(--menu-active-item-text-color);
             font-weight: bold;
             border-left: 4px solid var(--primary-color);
-
-            // > i {
-            // color: $activeMenuItemTextColor;
-            // }
+/*
+            > i {
+              color: $activeMenuItemTextColor;
+            }
+*/
           }
         }
       }
@@ -65,11 +68,11 @@
       .layout-inline-menu-action,
       .layout-inline-menu-action-panel .layout-inline-menu-action-item {
         color: var(--menu-item-text-color);
-
-        // i {
-        //   color: var(--menu-item-text-color);
-        // }
-
+/*
+        i {
+          color: var(--menu-item-text-color);
+        }
+*/
         &:hover {
           background-color: var(--menu-item-hover-bg-color);
         }
diff --git a/libs/portal-layout-styles/src/styles/shell/shell.scss b/libs/portal-layout-styles/src/styles/shell/shell.scss
index 21d53e03..a4116f5a 100644
--- a/libs/portal-layout-styles/src/styles/shell/shell.scss
+++ b/libs/portal-layout-styles/src/styles/shell/shell.scss
@@ -1,7 +1,7 @@
-@import './_variables'; // The variables were checked
+@import './_variables';
 
 :root {
-  // Top Bar Variables
+  /* Top Bar Variables */
   --topbar-bg-color: #0D3650;
   --topbar-text-color: #ffffff;
   --topbar-left-bg-color: #0D3650;
@@ -11,7 +11,7 @@
   --menu-button-text-color: #ffffff;
   --logo-color: #ffffff
 
-  // Body Variables
+  /* Body Variables */
   --page-padding: 1rem;
   --page-padding-lg: calc(var(--page-padding) * 2);
   --body-bg-color: #f7f7f7;
@@ -19,12 +19,11 @@
   --text-secondary-color: #262626;
   --font-size: 14px;
   --font-family: Ubuntu, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif;
-  // --border-width: #{$border-width};
   --border-radius: 5px;
   --transition-duration: 0.2s;
   --root-font-size: 14px;
 
-  // Contents Variables
+  /* Contents Variables */
   --content-bg-color: #ffffff;
   --content-alt-bg-color: #ffffff;
   --overlay-content-bg-color: #ffffff;
@@ -32,11 +31,11 @@
   --solid-surface-text-color: #ffffff;
   --divider-color: #e4e4e4;
 
-  // Animation Variables
+  /* Animation Variables */
   --animation-duration: 0.2s;
   --animation-timing: #{$animationTimingFunction};
 
-  // Menu Style Variables
+  /* Menu Style Variables */
   --menu-text-color: #274B5F;
   --menu-bg-color: #fdfeff;
   --menu-item-text-color: #515c66;
@@ -51,7 +50,7 @@
   --menu-shadow: #{$menuShadow};
   --menu-wrapper-width: 17rem;
 
-  // Headings Style Variables
+  /* Headings Style Variables */
   --h1-font-size: #{$h1FontSize};
   --h2-font-size: #{$h2FontSize};
   --h3-font-size: #{$h3FontSize};
@@ -59,30 +58,22 @@
   --h5-font-size: #{$h5FontSize};
   --h6-font-size: #{$h6FontSize};
 
-  // General Colors Variables
+  /* General Colors Variables */
   --primary-color: #274B5F;
   --secondary-color: #1C4257;
 }
 
-@import '_mixins'; // The variables were checked
-@import '_common'; // The variables were checked
-@import '_colors'; // The variables were checked
-@import './_typography'; //The variables were checked
+@import '_mixins';
+@import '_common';
+@import '_colors';
+@import './_typography';
 @import '_fonts';
-// @import './_loader';
-@import './_animation'; // The variables were checked
-@import './_utils'; // The variables were checked
-@import './topbar/_topbar'; //The variables were checked
-// @import './_rightmenu';
-@import './menu/_menu'; // The variables were checked
-// @import './_megamenu';
-// @import './_widgets';
-@import './_main'; // The variables were checked
-@import './_footer'; // Coud not find the color for the footer Colors
-// @import './_help';
-@import './_breadcrumb'; // The variables were checked
+@import './_animation';
+@import './_utils';
+@import './topbar/_topbar';
+@import './menu/_menu';
+@import './_main';
+@import './_footer';
+@import './_breadcrumb';
 @import './_input_styles';
-@import './_validation'; // control validation
-
-
-// TODO check the included files, remove those not needed, cleanup those that are required
+@import './_validation';
diff --git a/libs/portal-layout-styles/src/styles/shell/topbar/_topbar_common.scss b/libs/portal-layout-styles/src/styles/shell/topbar/_topbar_common.scss
index bf939891..70b0e14e 100644
--- a/libs/portal-layout-styles/src/styles/shell/topbar/_topbar_common.scss
+++ b/libs/portal-layout-styles/src/styles/shell/topbar/_topbar_common.scss
@@ -18,7 +18,7 @@
     height: 100%;
     position: relative;
     flex: 0 0 var(--menu-wrapper-width);
-    // padding-right: 1.25rem;
+    /* padding-right: 1.25rem; */
 
     .layout-topbar-logo {
       width: 100%;