dialog static method

String dialog({ required ColorScheme colorScheme, })

Build the CSS for dialog

Implementation

static String dialog({required ColorScheme colorScheme}) {
  final backgroundColor = hexFromColor(color: colorScheme.surface);
  final foregroundColor = hexFromColor(color: colorScheme.onSurface);
  final shadowColor = "${hexFromColor(color: colorScheme.shadow)}20";
  final dialog = elementCss(
    selector: [
      '.note-dialog',
      '.note-popover',
    ].join(','),
    properties: {
      'background-color': backgroundColor,
      'color': foregroundColor,
      'border-color': "${foregroundColor}12",
      'box-shadow': "0 5px 10px $shadowColor",
    },
  );
  final bottomArrowCss = elementCss(
    selector: '.note-popover.bottom .note-popover-arrow',
    properties: {'border-bottom-color': shadowColor},
  );
  final bottomArrowAfterCss = elementCss(
    selector: '.note-popover.bottom .note-popover-arrow:after',
    properties: {'border-bottom-color': backgroundColor},
  );
  final topArrowCss = elementCss(
    selector: '.note-popover.top .note-popover-arrow',
    properties: {'border-top-color': shadowColor},
  );
  final topArrowAfterCss = elementCss(
    selector: '.note-popover.top .note-popover-arrow:after',
    properties: {'border-top-color': backgroundColor},
  );
  final rightArrowCss = elementCss(
    selector: '.note-popover.right .note-popover-arrow',
    properties: {'border-right-color': shadowColor},
  );
  final rightArrowAfterCss = elementCss(
    selector: '.note-popover.right .note-popover-arrow:after',
    properties: {'border-right-color': backgroundColor},
  );
  final leftArrowCss = elementCss(
    selector: '.note-popover.right .note-popover-arrow',
    properties: {'border-right-color': shadowColor},
  );
  final leftArrowAfterCss = elementCss(
    selector: '.note-popover.left .note-popover-arrow:after',
    properties: {'border-left-color': backgroundColor},
  );
  return [
    dialog,
    bottomArrowCss,
    bottomArrowAfterCss,
    topArrowCss,
    topArrowAfterCss,
    rightArrowCss,
    rightArrowAfterCss,
    leftArrowCss,
    leftArrowAfterCss,
  ].join();
}