fnsign_embedded-omnisearch/styles.css

246 lines
4.7 KiB
CSS
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* === Embedded Omnisearch Plugin Styles === */
.eo-hidden,
.eo-wrap .eo-hidden,
.eo-popover.eo-hidden {
display: none;
}
/* --- Code-block container (Obsidian-generated parent) --- */
.block-language-embedded-omnisearch {
width: 100%;
min-width: 0;
max-width: 100%;
overflow: hidden;
box-sizing: border-box;
}
/* --- Wrapper --- */
.eo-wrap {
margin: 16px auto 10px;
width: 100%;
min-width: 0;
max-width: 100%;
overflow: hidden;
box-sizing: border-box;
font-family: var(--font-interface);
}
/* --- Input --- */
.eo-input-wrap {
position: relative;
}
.eo-wrap input.omnisearch-input-field {
width: 100%;
box-sizing: border-box;
padding: 10px 44px 10px 12px;
border: 0;
border-radius: 6px;
background: var(--background-secondary);
color: var(--text-normal);
font-size: 0.8rem;
font-style: italic;
outline: none;
box-shadow: inset 0 0 0 1px var(--background-modifier-border);
}
.eo-wrap input.omnisearch-input-field.has-value {
font-style: normal;
}
.eo-wrap .eo-input-wrap input.omnisearch-input-field:focus,
.eo-wrap .eo-input-wrap input.omnisearch-input-field.has-value {
box-shadow: inset 0 0 0 3px var(--background-modifier-border-hover);
}
.eo-wrap input.omnisearch-input-field::selection {
background: var(--text-selection);
}
/* --- Clear button --- */
.eo-clear {
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
width: 20px;
height: 20px;
border-radius: 999px;
border: none;
background: transparent;
color: var(--text-muted);
cursor: pointer;
z-index: 10;
font-size: 12px;
line-height: 20px;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
transition: opacity 0.15s;
opacity: 0;
pointer-events: none;
}
.eo-clear.is-visible {
opacity: 1;
pointer-events: auto;
}
.eo-clear:hover {
color: var(--text-normal);
background: transparent;
box-shadow: none;
}
/* --- Status --- */
.eo-status {
margin: 6px 0 0;
font-size: 0.85em;
color: var(--text-muted);
}
/* --- Results --- */
.eo-results {
margin-top: 8px;
width: 100%;
min-width: 0;
}
/* --- Results Grid --- */
.eo-results-grid {
width: 100%;
min-width: 0;
max-width: 100%;
background: transparent;
}
.eo-results-head-row,
.eo-results-row {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(4.5ch, max-content) minmax(0, 3fr);
min-width: 0;
background: transparent;
}
.eo-results-head-cell,
.eo-results-cell {
padding: 8px 10px;
min-width: 0;
box-sizing: border-box;
}
.eo-results-head-cell {
padding-top: 6px;
padding-bottom: 8px;
text-align: left;
font-size: 0.85em;
font-weight: 600;
color: var(--text-muted);
white-space: nowrap;
overflow-wrap: normal;
word-break: normal;
hyphens: none;
}
.eo-results-row:hover,
.eo-results-row:hover .eo-results-cell {
background: var(--background-secondary);
}
.eo-results-file,
.eo-results-preview {
overflow-wrap: anywhere;
}
.eo-results-link {
font-weight: 600;
text-decoration: none;
color: var(--text-normal);
}
.eo-results-link:hover {
text-decoration: underline;
color: var(--text-accent);
}
.eo-results-head-score,
.eo-results-score {
text-align: left;
color: var(--text-muted);
white-space: nowrap;
width: 1%;
min-width: 5ch;
}
.eo-results-score {
font-size: 0.85em;
}
.eo-results-preview {
font-size: 0.9em;
line-height: 1.5;
color: var(--text-muted);
}
/* --- Pagination --- */
.eo-page-bar {
display: flex;
justify-content: center;
align-items: center;
gap: 12px;
margin: 8px 0 0;
}
.eo-page-btn {
padding: 6px 16px;
border: 1px solid var(--background-modifier-border);
border-radius: 4px;
background: var(--background-secondary);
color: var(--text-normal);
cursor: pointer;
font-size: 1em;
transition: border-color 0.15s;
}
.eo-page-btn:hover:not(:disabled) {
border-color: var(--background-modifier-border-hover);
}
.eo-page-btn:disabled {
opacity: 0.35;
cursor: default;
}
.eo-page-info {
font-size: 0.85em;
color: var(--text-muted);
min-width: 80px;
text-align: center;
}
/* --- Popover --- */
.eo-popover {
position: fixed;
padding: 4px 10px;
background: var(--background-secondary);
color: var(--text-muted);
border: 1px solid var(--background-modifier-border);
border-radius: 4px;
font-size: 0.8em;
pointer-events: none;
z-index: 9999;
max-width: 500px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.omnisearch-highlight {
background-color: var(--eo-highlight-color, rgba(204,163,0,0.35));
color: var(--text-normal);
padding: 0 0.15em;
border-radius: 3px;
}