like-keditor/dist/index.css

A powerful, extensible, and customizable rich-text editor built on top of [Yoopta](https://yoopta.dev) - [Yoopta Docs](https://yoodocs.space). Comes with built-in support for images, videos, files, markdown export, and more!

/* src/components/editor.css */
.yoopta-editor {
  width: 100% !important;
  min-width: 300px !important;
  min-height: 300px !important;
}
.yoopta-placeholder[data-placeholder]::after {
  font-size: 1rem !important;
  color: #6B7280 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.yoopta-block-actions-plus {
  height: 2rem !important;
  width: 2rem !important;
  border-radius: 2rem !important;
  border: 1px solid #6B7280 !important;
  margin-top: -4px !important;
}
.yoopta-block-actions-plus svg {
  color: #6B7280 !important;
}
.yoopta-block-actions-plus:hover {
  background-color: #FFFFFF !important;
  cursor: pointer;
}
.yoopta-block-actions-drag {
  height: 2rem !important;
  border-radius: 8px !important;
  margin-top: -4px !important;
}
.yoopta-block-actions-drag svg {
  color: #6B7280 !important;
}
.yoopta-block-actions-drag:hover {
  background-color: rgba(0, 0, 0, 0.03) !important;
  cursor: grab;
}
.yoopta-block-action-buttons {
  gap: 0.5rem !important;
}
.yoopta-toolbar-root {
  background-color: #FFFFFF !important;
  border-radius: .75rem !important;
  border: 1px solid rgba(0, 0, 0, 0.03) !important;
  padding: 1px !important;
  shadow: none !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
}
.yoopta-toolbar-root .yoopta-toolbar-group {
  margin: 0px !important;
  padding: 0px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
}
.yoopta-toolbar-root .yoopta-toolbar-separator {
  margin: 0px !important;
  display: none !important;
}
.yoopta-toolbar-root .yoopta-toolbar-group button {
  background-color: #FFFFFF !important;
  height: 2.5rem !important;
  border-radius: 0.5rem !important;
  padding: 8px 12px !important;
  font-size: 0.875rem;
}
.yoopta-toolbar-root .yoopta-toolbar-group button[aria-pressed=true] {
  background-color: rgba(0, 0, 0, 0.03) !important;
  color: #27272A !important;
}
.yoopta-toolbar-root .yoopta-toolbar-group button:hover {
  background-color: rgba(0, 0, 0, 0.03) !important;
  cursor: pointer;
}
.yoopta-toolbar-root .yoopta-toolbar-group .button yoopta-toolbar-color-text {
  background-color: #FFFFFF !important;
}
.yoo-toolbar-z-50 div {
  border-radius: 0.5rem !important;
  padding: 0.5rem !important;
}
.yoo-toolbar-z-50 div div button {
  border-radius: 0.3rem !important;
  padding: 8px 12px !important;
  font-size: .875rem;
  color: #27272A !important;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.yoo-toolbar-z-50 div .yoo-toolbar-grid {
  margin: 0 !important;
}
.yoo-toolbar-z-50 div .yoo-toolbar-border-t {
  border-top: none !important;
}
.yoo-toolbar-z-50 div .yoo-toolbar-border-t .yoo-toolbar-mt-2 {
  margin: 0 !important;
  padding: 8px 0px !important;
}
.yoo-toolbar-z-50 div .yoo-toolbar-border-t .yoo-toolbar-mt-2 .react-colorful {
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
  padding: 0 !important;
}
.yoopta-paragraph {
  margin: 0 !important;
}
.yoopta-link-tool .yoo-link-tool-bg-\[\#1183ff\] {
  border-radius: 0.5rem !important;
  background-color: rgb(0, 0, 0) !important;
  min-width: 60px !important;
  padding: .5rem .75rem !important;
}
.yoopta-extended-block-actions {
  height: 2rem !important;
  width: 2rem !important;
  border-radius: 2rem !important;
  background-color: #FFFFFF !important;
  border: 1px solid #6B7280 !important;
  padding: 0px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
}
::selection {
  background-color: rgba(0, 0, 0, 0.15);
}

/* src/components/render.css */
#details-container-TdaSo6fg2z *,
#details-container-TdaSo6fg2z *::before,
#details-container-TdaSo6fg2z *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  outline: none;
  transition: all 0.2s ease;
}
#details-container-TdaSo6fg2z h1,
#details-container-TdaSo6fg2z h2,
#details-container-TdaSo6fg2z h3,
#details-container-TdaSo6fg2z h4,
#details-container-TdaSo6fg2z h5,
#details-container-TdaSo6fg2z h6 {
  font-weight: 600;
  line-height: 1.25;
  margin-bottom: 0.75rem;
}
#details-container-TdaSo6fg2z h1 {
  font-size: 2.25rem;
}
#details-container-TdaSo6fg2z h2 {
  font-size: 1.875rem;
}
#details-container-TdaSo6fg2z h3 {
  font-size: 1.5rem;
}
#details-container-TdaSo6fg2z h4 {
  font-size: 1.25rem;
}
#details-container-TdaSo6fg2z h5 {
  font-size: 1.125rem;
}
#details-container-TdaSo6fg2z h6 {
  font-size: 1rem;
}
#details-container-TdaSo6fg2z p {
  margin-bottom: 1rem;
}
#details-container-TdaSo6fg2z a {
  text-decoration: none;
  font-weight: 500;
}
#details-container-TdaSo6fg2z a:hover {
  text-decoration: underline;
}
#details-container-TdaSo6fg2z ul,
#details-container-TdaSo6fg2z ol {
  padding-left: 1.5rem;
  margin-bottom: 1rem;
}
#details-container-TdaSo6fg2z li {
  margin-bottom: 0.5rem;
}
#details-container-TdaSo6fg2z img {
  max-width: 100%;
  border-radius: 0.5rem;
  margin: 1rem 0;
}
#details-container-TdaSo6fg2z blockquote {
  border-left: 4px solid hsl(221.2, 83.2%, 53.3%);
  padding-left: 1rem;
  margin: 1rem 0;
  font-style: italic;
  border-radius: 0.25rem;
}
#details-container-TdaSo6fg2z pre,
#details-container-TdaSo6fg2z code {
  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    monospace;
  font-size: 0.95rem;
  border-radius: 0.375rem;
  padding: 0.25rem 0.5rem;
  overflow-x: auto;
}
#details-container-TdaSo6fg2z table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
  font-size: 0.95rem;
}
#details-container-TdaSo6fg2z th,
#details-container-TdaSo6fg2z td {
  border: 1px solid hsl(214.3, 31.8%, 91.4%);
  padding: 0.75rem 1rem;
  text-align: left;
}
#details-container-TdaSo6fg2z th {
  font-weight: 600;
}
#details-container-TdaSo6fg2z input,
#details-container-TdaSo6fg2z select,
#details-container-TdaSo6fg2z textarea,
#details-container-TdaSo6fg2z button {
  font: inherit;
  border: 1px solid hsl(214.3, 31.8%, 91.4%);
  border-radius: 0.5rem;
  padding: 0.5rem 0.75rem;
  margin-bottom: 1rem;
}
#details-container-TdaSo6fg2z input:focus,
#details-container-TdaSo6fg2z select:focus,
#details-container-TdaSo6fg2z textarea:focus {
  border-color: hsl(221.2, 83.2%, 53.3%);
  box-shadow: 0 0 0 2px hsl(221.2, 83.2%, 90%);
}
#details-container-TdaSo6fg2z button {
  cursor: pointer;
  font-weight: 500;
}
/*# sourceMappingURL=index.css.map */