ollama_semantic_function_calling / ollamatools-new / keet / assets / css / emoji-picker.css

div.keet-emoji-picker {
  --font: Inter;
  --text-color: var(--color-grey-300);
  --background-color: var(--color-grey-700);
  --hover-background-color: var(--color-blue-200);
  --border-color: var(--color-grey-700);
  --category-name-text-color: var(--color-grey-300);
  --category-tab-color: var(--color-grey-300);
  --category-tab-active-color: var(--color-blue-200);
  --secondary-text-color: var(--color-grey-300);
  --search-focus-border-color: var(--color-blue-200);
  --search-icon-color: var(--color-grey-300);
  z-index: 999;
}

.keet-emoji-picker.picmo__picker {
  gap: 0 !important;
  border: solid 1px var(--color-grey-450) !important;
  box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.10);
  padding: 8px;
  border-radius: 16px !important;
}

.keet-emoji-picker .picmo__emojiCategory .picmo__categoryName {
    font-weight: 400;
  text-transform: capitalize !important;
  -webkit-font-smoothing: antialiased;
}

.keet-emoji-picker .picmo__emojiButton {
  width: unset;
  border-radius: 0.5rem;
  font-family: "Segoe UI emoji";
}

.keet-emoji-picker .picmo__previewEmoji span {
  font-family: "Segoe UI emoji";
}

.keet-emoji-picker .picmo__emojiArea {
  overflow-y: overlay !important;
}

#skin-button {
  background: var(--color-grey-600);
}

.keet-emoji-picker .picmo__searchField::placeholder {
  color: var(--color-grey-350) !important;
}

.keet-emoji-picker .picmo__searchField {
  -webkit-font-smoothing: antialiased;
  color: var(--color-grey-200) !important;
  background: var(--color-grey-600) !important;
  border-radius: 8px;
}

.keet-emoji-picker .picmo__noRecents {
  -webkit-font-smoothing: antialiased;
  color: var(--color-grey-200) !important;
}

div.keet-emoji-picker .picmo__icon {
  height: 1.1rem;
}

.picmo__categoryName, .picmo__emojiContainer, .picmo__categoryButtons, .picmo__searchContainer, .picmo__preview {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.picmo__preview {
  padding: 0 !important;
  padding-top: 16px !important;
}

.picmo__header {
  padding: 0 !important;
  padding-bottom: 8px !important;
  border-color: var(--color-grey-600) !important;
}

div.keet-emoji-picker .picmo__categoryButtons .picmo__categoryTab.picmo__categoryTabActive .picmo__categoryButton {
  background: transparent !important;
  border: none !important;
}

.keet-emoji-picker .picmo__categoryButton:focus {
  outline: none;
}

.keet-emoji-picker .emojiContainer {
  gap: 3px !important;
}

.picmo__header > * {
  overflow: auto;
}

.picmo__customEmoji {
  object-fit: contain;
  min-width: 1.5rem;
  min-height: 1.5rem;
}

/* replace 'robot' icon with a 'keet' in picmo categores */

.picmo__picker .picmo__categoryButtons .picmo__categoryTab:has(button[data-category="custom"]) {
  background-image: url(/assets/images/picmo-custom-category.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 20px;
}

.picmo__picker .picmo__categoryButtons .picmo__categoryTabActive:has(button[data-category="custom"]) {
  background-image: url(/assets/images/picmo-custom-category-active.svg);
}

.picmo__picker .picmo__categoryButtons .picmo__categoryTab:has(button[data-category="custom"]) svg {
  visibility: hidden;
}

/* replace 'robot' icon with a 'keet' in picmo content */

.picmo__emojiArea .picmo__emojiCategory:has(h3[data-category="custom"]) svg path {
  visibility: hidden;
}

.picmo__emojiArea .picmo__emojiCategory:has(h3[data-category="custom"]) svg {
  background-image: url(/assets/images/picmo-custom-category.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 1.25rem;
  height: 1.25rem;
}