@gravity-ui/uikit/build/cjs/components/legacy/Popover/Popover.css

Gravity UI base styling and components

.g-popover-legacy {
  display: inline-block;
  position: relative;
}
.g-popover-legacy:not(.g-popover-legacy_disabled) {
  cursor: pointer;
}
.g-popover-legacy__handler {
  display: inline-block;
}
.g-popover-legacy__tooltip {
  --_--padding: 16px;
  --_--close-offset: 8px;
  --_--close-size: 24px;
  box-sizing: border-box;
  min-height: 40px;
  max-width: var(--g-popover-max-width, 300px);
  padding: var(--g-popover-padding, var(--_--padding));
  cursor: default;
}
.g-popover-legacy__tooltip-title {
  font-family: var(--g-text-subheader-font-family);
  font-weight: var(--g-text-subheader-font-weight);
  font-size: var(--g-text-subheader-3-font-size);
  line-height: var(--g-text-subheader-3-line-height);
  display: inline-flex;
  margin: 0 0 12px;
}
.g-popover-legacy__tooltip-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-block-start: 20px;
}
.g-popover-legacy__tooltip-button {
  flex: 1;
}
.g-popover-legacy__tooltip-close {
  position: absolute;
  inset-block-start: var(--_--close-offset);
  inset-inline-end: var(--_--close-offset);
}
.g-popover-legacy__tooltip-content {
  font-family: var(--g-text-body-font-family);
  font-weight: var(--g-text-body-font-weight);
  font-size: var(--g-text-body-1-font-size);
  line-height: var(--g-text-body-1-line-height);
  overflow-wrap: break-word;
}
.g-popover-legacy__tooltip-content_secondary {
  opacity: 0.7;
}
.g-popover-legacy__tooltip-links > * {
  margin-block-start: 8px;
}
.g-popover-legacy__tooltip-links > *:first-child {
  margin-block-start: 0;
}
.g-popover-legacy__tooltip-content + .g-popover-legacy__tooltip-links > *:first-child {
  margin-block-start: 12px;
}
.g-popover-legacy__tooltip-link {
  font-family: var(--g-text-body-font-family);
  font-weight: var(--g-text-body-font-weight);
  font-size: var(--g-text-body-1-font-size);
  line-height: var(--g-text-body-1-line-height);
  display: inline-block;
}
.g-popover-legacy__tooltip_theme_info.g-popover-legacy__tooltip_theme_info, .g-popover-legacy__tooltip_theme_info .g-popover-legacy__tooltip_theme_announcement, .g-popover-legacy__tooltip_theme_announcement.g-popover-legacy__tooltip_theme_info, .g-popover-legacy__tooltip_theme_announcement .g-popover-legacy__tooltip_theme_announcement {
  color: var(--g-color-text-primary);
}
.g-popover-legacy__tooltip_force-links-appearance.g-popover-legacy__tooltip_theme_info .g-popover-legacy__tooltip-content a:not(.g-button), .g-popover-legacy__tooltip_theme_announcement .g-popover-legacy__tooltip-content a:not(.g-button) {
  text-decoration: none;
  color: var(--g-color-text-link);
}
.g-popover-legacy__tooltip_force-links-appearance.g-popover-legacy__tooltip_theme_info .g-popover-legacy__tooltip-content a:not(.g-button):hover, .g-popover-legacy__tooltip_theme_announcement .g-popover-legacy__tooltip-content a:not(.g-button):hover {
  color: var(--g-color-text-link-hover);
}

.g-popover-legacy__tooltip_theme_announcement {
  --g-popup-background-color: var(--g-color-base-simple-hover-solid);
  --g-popup-border-color: var(--g-color-base-simple-hover-solid);
}
.g-popover-legacy__tooltip_theme_special {
  --g-popup-background-color: var(--g-color-base-brand);
  --g-popup-border-color: var(--g-color-base-brand);
  color: var(--g-color-text-light-primary);
}
.g-popover-legacy__tooltip_theme_special .g-popover-legacy__tooltip-content a:not(.g-button) {
  font-weight: var(--g-text-accent-font-weight);
  color: var(--g-color-text-light-primary);
}
.g-popover-legacy__tooltip_theme_special .g-popover-legacy__tooltip-content a:not(.g-button):hover {
  color: var(--g-color-text-light-secondary);
}
.g-popover-legacy__tooltip_theme_special .g-link {
  color: var(--g-color-text-light-primary);
}
.g-popover-legacy__tooltip_theme_special .g-link:hover {
  color: var(--g-color-text-light-secondary);
}
.g-popover-legacy__tooltip_size_l {
  --_--padding: 24px;
}
.g-popover-legacy__tooltip_size_l .g-popover-legacy__tooltip-title {
  font-family: var(--g-text-header-font-family);
  font-weight: var(--g-text-header-font-weight);
  font-size: var(--g-text-header-1-font-size);
  line-height: var(--g-text-header-1-line-height);
}
.g-popover-legacy__tooltip_size_l .g-popover-legacy__tooltip-content {
  font-family: var(--g-text-body-font-family);
  font-weight: var(--g-text-body-font-weight);
  font-size: var(--g-text-body-2-font-size);
  line-height: var(--g-text-body-2-line-height);
}
.g-popover-legacy__tooltip_with-close .g-popover-legacy__tooltip-title,
.g-popover-legacy__tooltip_with-close .g-popover-legacy__tooltip-content {
  padding-inline-end: calc(var(--_--close-offset) + var(--_--close-size) - var(--_--padding));
}