@kenyaemr/esm-bed-management-app 1.0.1-pre.4 → 8.1.1-pre.116

package/src/workspace/overlay.component.tsx

@@ -1,55 +0,0 @@
-import React from "react";
-import { Button, Header } from "@carbon/react";
-import { ArrowLeft, Close } from "@carbon/react/icons";
-import { isDesktop, useLayoutType } from "@openmrs/esm-framework";
-import styles from "./overlay.scss";
-import { useTranslation } from "react-i18next";
-
-interface OverlayProps {
-  closePanel: () => void;
-  header: string;
-  children?: React.ReactNode;
-}
-
-const Overlay: React.FC<OverlayProps> = ({ closePanel, children, header }) => {
-  const layout = useLayoutType();
-  const { t } = useTranslation();
-
-  return (
-    <div
-      className={
-        isDesktop(layout) ? styles.desktopOverlay : styles.tabletOverlay
-      }
-    >
-      {isDesktop(layout) ? (
-        <div className={styles.desktopHeader}>
-          <div className={styles.headerContent}>{header}</div>
-          <Button
-            className={styles.closePanelButton}
-            onClick={closePanel}
-            kind="ghost"
-            hasIconOnly
-            renderIcon={(props) => <Close size={16} {...props} />}
-            iconDescription={t("closeOverlay", "Close overlay")}
-          />
-        </div>
-      ) : (
-        <Header
-          aria-label="Tablet overlay"
-          className={styles.tabletOverlayHeader}
-        >
-          <Button
-            onClick={closePanel}
-            hasIconOnly
-            renderIcon={(props) => <ArrowLeft size={16} {...props} />}
-            iconDescription={t("closeOverlay", "Close overlay")}
-          />
-          <div className={styles.headerContent}>{header}</div>
-        </Header>
-      )}
-      {children}
-    </div>
-  );
-};
-
-export default Overlay;

package/src/workspace/overlay.scss

@@ -1,96 +0,0 @@
-@use '@carbon/styles/scss/spacing';
-@use '@carbon/styles/scss/type';
-@import '~@openmrs/esm-styleguide/src/vars';
-@import '../root.scss';
-
-.desktopOverlay {
-  position: fixed;
-  top: spacing.$spacing-09;
-  width: 37rem;
-  right: 0;
-  bottom: 0;
-  border-left: 1px solid $text-03;
-  background-color: $ui-01;
-  overflow-y: auto;
-  height: calc(100vh - 3rem);
-  z-index: 99999;
-  display: grid;
-  grid-template-rows: 1fr auto;
-}
-
-.desktopOverlay::after {
-  height: 100%;
-  border-left: 1px solid $text-03;
-}
-
-.tabletOverlay {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  z-index: 9999;
-  background-color: $ui-01;
-  overflow: hidden;
-  padding-top: spacing.$spacing-09;
-  display: grid;
-  grid-template-rows: 1fr auto;
-  overflow-y: auto;
-  height: 100vh;
-}
-
-.tabletOverlayHeader {
-  button {
-    @include brand-01(background-color);
-  }
-
-  .headerContent {
-    color: $ui-02;
-  }
-}
-
-.desktopHeader {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  background-color: $ui-03;
-  border-bottom: 1px solid $text-03;
-  position: absolute;
-  position: -webkit-sticky;
-  width: 100%;
-  z-index: 1000;
-  top: 0;
-}
-
-.headerContent {
-  @include type.type-style('heading-compact-02');
-  padding: 0 spacing.$spacing-05;
-  color: $ui-05;
-}
-
-.closePanelButton {
-  background-color: $ui-background;
-  color: $ui-05;
-  fill: $ui-05;
-}
-
-/* Desktop */
-:global(.omrs-breakpoint-gt-tablet) {
-  .overlayContent {
-    padding: 0 0 0 0;
-    overflow-y: auto;
-  }
-}
-
-/* Tablet */
-:global(.omrs-breakpoint-lt-desktop) {
-  .overlayContent {
-    padding: 0 0 0 0;
-    overflow-y: auto;
-  }
-}
-
-.wardLabel {
-   @include type.type-style('label-01');
-  // color: colors.$gray-70;
-}