diff --git a/redisinsight/ui/src/components/recommendation/recommendation-voting/components/vote-option/VoteOption.tsx b/redisinsight/ui/src/components/recommendation/recommendation-voting/components/vote-option/VoteOption.tsx
index 1a65d1b0a2..cb3d5424a6 100644
--- a/redisinsight/ui/src/components/recommendation/recommendation-voting/components/vote-option/VoteOption.tsx
+++ b/redisinsight/ui/src/components/recommendation/recommendation-voting/components/vote-option/VoteOption.tsx
@@ -15,13 +15,39 @@ import { Nullable } from 'uiSrc/utils'
 import { Col, FlexItem, Row } from 'uiSrc/components/base/layout/flex'
 import { Text } from 'uiSrc/components/base/text'
 import { CancelSlimIcon } from 'uiSrc/components/base/icons'
-import { IconButton, PrimaryButton } from 'uiSrc/components/base/forms/buttons'
+import { IconButton } from 'uiSrc/components/base/forms/buttons'
 import { Link } from 'uiSrc/components/base/link/Link'
 import { RiPopover, RiTooltip } from 'uiSrc/components/base'
 import { RiIcon } from 'uiSrc/components/base/icons/RiIcon'
 
 import { getVotedText, iconType, voteTooltip } from './utils'
 import styles from './styles.module.scss'
+import styled from 'styled-components'
+import { Theme } from 'uiSrc/components/base/theme/types'
+
+const GitHubLink = styled(Link)`
+  padding: 4px 8px 4px 4px;
+
+  margin-top: 10px;
+  height: 22px !important;
+  background-color: ${({ theme }: { theme: Theme }) =>
+    theme.components.button.variants.primary.normal?.bgColor};
+  color: ${({ theme }: { theme: Theme }) =>
+    theme.components.button.variants.primary.normal?.textColor};
+  &:hover {
+    text-decoration: none !important;
+    background-color: ${({ theme }: { theme: Theme }) =>
+      theme.components.button.variants.primary.hover?.bgColor};
+    color: ${({ theme }: { theme: Theme }) =>
+      theme.components.button.variants.primary.normal?.textColor};
+  }
+
+  & > span {
+    display: flex;
+    gap: 4px;
+    align-items: center;
+  }
+`
 
 export interface Props {
   voteOption: Vote
@@ -148,28 +174,22 @@ const VoteOption = (props: Props) => {
             </Row>
           </FlexItem>
           <FlexItem grow>
-            <PrimaryButton
-              aria-label="recommendation feedback"
+            <GitHubLink
               data-testid="recommendation-feedback-btn"
-              className={styles.feedbackBtn}
-              size="s"
+              className={styles.link}
+              href={EXTERNAL_LINKS.recommendationFeedback}
+              target="_blank"
+              data-test-subj="github-repo-link"
             >
-              <Link
-                className={styles.link}
-                href={EXTERNAL_LINKS.recommendationFeedback}
-                target="_blank"
-                data-test-subj="github-repo-link"
-              >
-                <RiIcon
-                  className={styles.githubIcon}
-                  aria-label="redis insight github issues"
-                  type="GithubIcon"
-                  color="informative100"
-                  data-testid="github-repo-icon"
-                />
-                To Github
-              </Link>
-            </PrimaryButton>
+              <RiIcon
+                className={styles.githubIcon}
+                aria-label="redis insight github issues"
+                type="GithubIcon"
+                color="informative100"
+                data-testid="github-repo-icon"
+              />
+              To Github
+            </GitHubLink>
           </FlexItem>
         </Col>
       </div>
diff --git a/redisinsight/ui/src/components/scan-more/ScanMore.tsx b/redisinsight/ui/src/components/scan-more/ScanMore.tsx
index 5fca66d6c9..96c168f55e 100644
--- a/redisinsight/ui/src/components/scan-more/ScanMore.tsx
+++ b/redisinsight/ui/src/components/scan-more/ScanMore.tsx
@@ -40,7 +40,6 @@ const ScanMore = ({
         size="s"
         style={style ?? { marginLeft: 25, height: 26 }}
         disabled={loading}
-        className={styles.btn}
         onClick={() =>
           loadMoreItems?.({
             stopIndex: SCAN_COUNT_DEFAULT - 1,
@@ -50,7 +49,11 @@ const ScanMore = ({
         data-testid="scan-more"
       >
         {withAlert && (
-          <RiTooltip content={WARNING_MESSAGE} position="top">
+          <RiTooltip
+            content={WARNING_MESSAGE}
+            position="top"
+            anchorClassName={styles.anchor}
+          >
             <RiIcon type="InfoIcon" />
           </RiTooltip>
         )}
diff --git a/redisinsight/ui/src/components/scan-more/styles.module.scss b/redisinsight/ui/src/components/scan-more/styles.module.scss
index 7ca1f69fc7..7843e9d806 100644
--- a/redisinsight/ui/src/components/scan-more/styles.module.scss
+++ b/redisinsight/ui/src/components/scan-more/styles.module.scss
@@ -1,11 +1,6 @@
-.btn {
-  :global(.euiButtonContent .euiButton__text) {
-    font: normal normal normal 12px/18px Graphik, sans-serif !important;
-    letter-spacing: -0.12px;
-  }
-
-  svg {
-    margin-bottom: 2px;
-    margin-right: 6px;
-  }
+.anchor {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: var(--size-s);
 }
diff --git a/redisinsight/ui/src/components/side-panels/panels/live-time-recommendations/LiveTimeRecommendations.tsx b/redisinsight/ui/src/components/side-panels/panels/live-time-recommendations/LiveTimeRecommendations.tsx
index ce6e4561ae..83a85ca94a 100644
--- a/redisinsight/ui/src/components/side-panels/panels/live-time-recommendations/LiveTimeRecommendations.tsx
+++ b/redisinsight/ui/src/components/side-panels/panels/live-time-recommendations/LiveTimeRecommendations.tsx
@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 import { useHistory, useParams } from 'react-router-dom'
 import { remove } from 'lodash'
+import styled from 'styled-components'
 
 import { FeatureFlags, DEFAULT_DELIMITER, Pages } from 'uiSrc/constants'
 import {
@@ -35,11 +36,28 @@ import { ColorText, Text } from 'uiSrc/components/base/text'
 import { Checkbox } from 'uiSrc/components/base/forms/checkbox/Checkbox'
 
 import { RiIcon } from 'uiSrc/components/base/icons/RiIcon'
-import { Link } from 'uiSrc/components/base/link/Link'
 import Recommendation from './components/recommendation'
 import WelcomeScreen from './components/welcome-screen'
 import PopoverRunAnalyze from './components/popover-run-analyze'
 import styles from './styles.module.scss'
+import { Row } from 'uiSrc/components/base/layout/flex'
+import { Spacer } from 'uiSrc/components/base/layout'
+
+const FooterLink = styled.button<{
+  onClick?: () => void;
+  'data-testid'?: string;
+  children?: React.ReactNode;
+}>`
+  font:
+    normal normal 400 12px/14px Graphik,
+    sans-serif !important;
+  padding: 2px 0 0;
+  margin: 0;
+  text-decoration: underline !important;
+  :hover {
+    text-decoration: none !important;
+  }
+`
 
 const LiveTimeRecommendations = () => {
   const { provider, connectionType } = useSelector(connectedInstanceSelector)
@@ -137,25 +155,26 @@ const LiveTimeRecommendations = () => {
 
   const renderHeader = () => (
     <div className={styles.actions}>
-      <div>
-        <ColorText className={styles.boldText}>Our Tips</ColorText>
+      <Row align="center" gap="s">
+        <ColorText variant="semiBold" className={styles.boldText}>
+          Our Tips
+        </ColorText>
         <RiTooltip
           position="bottom"
           className={styles.tooltip}
-          anchorClassName={styles.tooltipAnchor}
           content={
-            <>
+            <Text size="s">
               Tips will help you improve your database.
-              <br />
+              <Spacer size="s" />
               New tips appear while you work with your database, including how
               to improve performance and optimize memory usage.
               <FeatureFlagComponent name={FeatureFlags.envDependent}>
                 <>
-                  <br />
+                  <Spacer size="s" />
                   Eager for more tips? Run Database Analysis to get started.
                 </>
               </FeatureFlagComponent>
-            </>
+            </Text>
           }
         >
           <RiIcon
@@ -166,10 +185,9 @@ const LiveTimeRecommendations = () => {
           />
         </RiTooltip>
         <FeatureFlagComponent name={FeatureFlags.envDependent}>
-          <Link
+          <a
             href={EXTERNAL_LINKS.githubRepo}
             target="_blank"
-            style={{ marginLeft: 6 }}
             data-testid="github-repo-btn"
           >
             <RiIcon
@@ -179,9 +197,9 @@ const LiveTimeRecommendations = () => {
               size="s"
               data-testid="github-repo-icon"
             />
-          </Link>
+          </a>
         </FeatureFlagComponent>
-      </div>
+      </Row>
 
       {isShowHiddenDisplayed && (
         <Checkbox
@@ -230,13 +248,12 @@ const LiveTimeRecommendations = () => {
                     : ANALYZE_TOOLTIP_MESSAGE
                 }
               >
-                <Link
-                  className={styles.link}
+                <FooterLink
                   onClick={() => setIsShowApproveRun(true)}
                   data-testid="footer-db-analysis-link"
                 >
                   Database Analysis
-                </Link>
+                </FooterLink>
               </PopoverRunAnalyze>
               {' to get more tips'}
             </Text>
diff --git a/redisinsight/ui/src/components/side-panels/panels/live-time-recommendations/components/recommendation/Recommendation.tsx b/redisinsight/ui/src/components/side-panels/panels/live-time-recommendations/components/recommendation/Recommendation.tsx
index 158c8b9f46..beaee71789 100644
--- a/redisinsight/ui/src/components/side-panels/panels/live-time-recommendations/components/recommendation/Recommendation.tsx
+++ b/redisinsight/ui/src/components/side-panels/panels/live-time-recommendations/components/recommendation/Recommendation.tsx
@@ -1,6 +1,7 @@
 import React, { useContext } from 'react'
 import { useDispatch } from 'react-redux'
 import { useHistory, useParams } from 'react-router-dom'
+import styled from 'styled-components'
 import { isUndefined } from 'lodash'
 
 import { findTutorialPath, Maybe, Nullable } from 'uiSrc/utils'
@@ -33,13 +34,12 @@ import {
 } from 'uiSrc/components/base/icons'
 
 import { openTutorialByPath } from 'uiSrc/slices/panels/sidePanels'
-import { FlexItem, Row } from 'uiSrc/components/base/layout/flex'
+import { Col, FlexItem, Row } from 'uiSrc/components/base/layout/flex'
 import { Card } from 'uiSrc/components/base/layout'
 import {
   IconButton,
   SecondaryButton,
 } from 'uiSrc/components/base/forms/buttons'
-import { Text } from 'uiSrc/components/base/text'
 import { RiIcon } from 'uiSrc/components/base/icons/RiIcon'
 import { RiAccordion } from 'uiSrc/components/base/display/accordion/RiAccordion'
 import { Link } from 'uiSrc/components/base/link/Link'
@@ -58,6 +58,10 @@ export interface IProps {
   recommendationsContent: IRecommendationsStatic
 }
 
+const RecommendationContent = styled(Card)`
+  padding: var(--size-m);
+`
+
 const RecommendationTitle = ({
   redisStack,
   title,
@@ -76,6 +80,7 @@ const RecommendationTitle = ({
       style={{
         maxWidth: '60%',
         textAlign: 'left',
+        overflow: 'hidden',
       }}
     >
       {redisStack && (
@@ -104,7 +109,9 @@ const RecommendationTitle = ({
           </Link>
         </FlexItem>
       )}
-      <FlexItem className="truncateText">{title}</FlexItem>
+      <div className="truncateText">
+        <span title={title}>{title}</span>
+      </div>
     </Row>
   )
 }
@@ -197,7 +204,7 @@ const Recommendation = ({
   }
 
   const recommendationContent = () => (
-    <Text>
+    <Col>
       {!isUndefined(tutorialId) && (
         <SecondaryButton
           filled
@@ -237,52 +244,47 @@ const Recommendation = ({
           />
         </div>
       </FeatureFlagComponent>
-    </Text>
+    </Col>
   )
 
   const renderButtonContent = (
-    <Row className={styles.fullWidth} align="center" justify="between">
-      <Row className={styles.fullWidth} align="center">
-        <FlexItem grow className="truncateText">
-          {title}
-        </FlexItem>
-        <FlexItem>
-          <RiTooltip
-            title="Snooze tip"
-            content="This tip will be removed from the list and displayed again when relevant."
-            position="top"
-            anchorClassName="flex-row"
-          >
-            <IconButton
-              icon={SnoozeIcon}
-              className={styles.snoozeBtn}
-              onClick={handleDelete}
-              aria-label="snooze tip"
-              data-testid={`${name}-delete-btn`}
-            />
-          </RiTooltip>
-        </FlexItem>
-        <FlexItem>
-          <RiTooltip
-            title={`${hide ? 'Show' : 'Hide'} tip`}
-            content={`${
-              hide
-                ? 'This tip will be shown in the list.'
-                : 'This tip will be removed from the list and not displayed again.'
-            }`}
-            position="top"
-            anchorClassName="flex-row"
-          >
-            <IconButton
-              icon={hide ? HideIcon : ShowIcon}
-              className={styles.hideBtn}
-              onClick={toggleHide}
-              aria-label="hide/unhide tip"
-              data-testid={`toggle-hide-${name}-btn`}
-            />
-          </RiTooltip>
-        </FlexItem>
-      </Row>
+    <Row className={styles.fullWidth} align="center" gap="s" justify="between">
+      <FlexItem>
+        <RiTooltip
+          title="Snooze tip"
+          content="This tip will be removed from the list and displayed again when relevant."
+          position="top"
+          anchorClassName="flex-row"
+        >
+          <IconButton
+            icon={SnoozeIcon}
+            className={styles.snoozeBtn}
+            onClick={handleDelete}
+            aria-label="snooze tip"
+            data-testid={`${name}-delete-btn`}
+          />
+        </RiTooltip>
+      </FlexItem>
+      <FlexItem>
+        <RiTooltip
+          title={`${hide ? 'Show' : 'Hide'} tip`}
+          content={`${
+            hide
+              ? 'This tip will be shown in the list.'
+              : 'This tip will be removed from the list and not displayed again.'
+          }`}
+          position="top"
+          anchorClassName="flex-row"
+        >
+          <IconButton
+            icon={hide ? HideIcon : ShowIcon}
+            className={styles.hideBtn}
+            onClick={toggleHide}
+            aria-label="hide/unhide tip"
+            data-testid={`toggle-hide-${name}-btn`}
+          />
+        </RiTooltip>
+      </FlexItem>
     </Row>
   )
 
@@ -309,9 +311,12 @@ const Recommendation = ({
         data-testid={`${name}-accordion`}
         aria-label={`${name}-accordion`}
       >
-        <Card className={styles.accordionContent} color="subdued">
+        <RecommendationContent
+          className={styles.accordionContent}
+          color="subdued"
+        >
           {recommendationContent()}
-        </Card>
+        </RecommendationContent>
       </RiAccordion>
     </div>
   )
diff --git a/redisinsight/ui/src/pages/browser/components/filter-key-type/FilterKeyType.tsx b/redisinsight/ui/src/pages/browser/components/filter-key-type/FilterKeyType.tsx
index 2b542e9a43..944ffcc344 100644
--- a/redisinsight/ui/src/pages/browser/components/filter-key-type/FilterKeyType.tsx
+++ b/redisinsight/ui/src/pages/browser/components/filter-key-type/FilterKeyType.tsx
@@ -23,11 +23,15 @@ import { appFeatureFlagsFeaturesSelector } from 'uiSrc/slices/app/features'
 import { AdditionalRedisModule } from 'uiSrc/slices/interfaces'
 import { OutsideClickDetector } from 'uiSrc/components/base/utils'
 import { HealthText } from 'uiSrc/components/base/text/HealthText'
-import { RiSelect } from 'uiSrc/components/base/forms/select/RiSelect'
+import {
+  defaultValueRender,
+  RiSelect,
+} from 'uiSrc/components/base/forms/select/RiSelect'
 import { Modal } from 'uiSrc/components/base/display'
 import { FILTER_KEY_TYPE_OPTIONS } from './constants'
 
 import styles from './styles.module.scss'
+import styled from 'styled-components'
 
 const ALL_KEY_TYPES_VALUE = 'all'
 
@@ -35,6 +39,11 @@ export interface Props {
   modules?: AdditionalRedisModule[]
 }
 
+const FilterKeyTypeSelect = styled(RiSelect)`
+  height: 100%;
+  border-radius: 0;
+`
+
 const FilterKeyType = ({ modules }: Props) => {
   const [isSelectOpen, setIsSelectOpen] = useState<boolean>(false)
   const [typeSelected, setTypeSelected] = useState<string>('all')
@@ -157,7 +166,9 @@ const FilterKeyType = ({ modules }: Props) => {
           onCancel={() => setIsInfoPopoverOpen(false)}
           className={styles.unsupportedInfoModal}
           data-testid="filter-not-available-modal"
-          content={<FilterNotAvailable onClose={() => setIsInfoPopoverOpen(false)} />}
+          content={
+            <FilterNotAvailable onClose={() => setIsInfoPopoverOpen(false)} />
+          }
           title={null}
         />
         {!isVersionSupported && (
@@ -168,15 +179,10 @@ const FilterKeyType = ({ modules }: Props) => {
             data-testid="unsupported-btn-anchor"
           />
         )}
-        <RiSelect
+        <FilterKeyTypeSelect
           disabled={!isVersionSupported}
           options={options}
-          valueRender={({ option, isOptionValue }) => {
-            if (isOptionValue) {
-              return option.inputDisplay
-            }
-            return option.dropdownDisplay
-          }}
+          valueRender={defaultValueRender}
           defaultOpen={isSelectOpen}
           value={typeSelected}
           onChange={(value: string) => onChangeType(value)}