Fix Obsidian Hover CSS

fixed-hover-queries.css

/*
  Some devices like mobile devices and laptops will not work for media queries that specify `@media (hover: hover) {}`.
  Using that media query doesn't seem to be necessary, but will break a lot of CSS in Obsidian on those certain devices if it's used.
  The following CSS is auto generated from the default Obsidian app.css file.

  GENERATED FOR Obsidian v1.8.7
*/

.markdown-source-view.mod-cm6 .cm-table-widget .table-row-btn:hover,
  .markdown-source-view.mod-cm6 .cm-table-widget .table-col-btn:hover {
    opacity: 1;
  }

.markdown-source-view.mod-cm6 .edit-block-button:hover {
    background-color: var(--background-modifier-hover);
  }

.empty-state-action:hover {
    color: var(--text-accent-hover);
  }

.view-header-title-parent .view-header-breadcrumb:hover {
    background-color: var(--background-modifier-hover);
    color: var(--text-normal);
  }

.setting-hotkey.has-conflict:hover {
    background-color: var(--background-modifier-error-hover);
  }

.setting-hotkey-icon:hover .svg-icon {
    opacity: 1;
  }

.setting-delete-hotkey:hover {
    background-color: var(--background-modifier-error);
    color: var(--text-on-accent);
  }

.setting-add-hotkey-button:hover,
  .setting-restore-hotkey-button:hover {
    background-color: var(--background-modifier-hover);
    color: var(--text-normal);
  }

.hotkey-filter-remove-button:hover {
    background-color: var(--background-modifier-hover);
  }

.spellchecker-dictionary-remove-button:hover {
    color: var(--text-normal);
  }

.community-item:hover {
    border-color: var(--background-modifier-border-hover);
  }

.status-bar-item.mod-clickable:hover {
    background-color: var(--background-modifier-hover);
    color: var(--text-normal);
  }

.status-bar-item.plugin-editor-status:hover,
  .status-bar-item.plugin-sync:hover {
    background-color: var(--background-modifier-hover);
  }

.titlebar-button-container .mod-back:hover,
  .titlebar-button-container .mod-forward:hover {
    color: var(--icon-color-hover);
  }

.titlebar-button:hover {
    opacity: 1;
    background-color: var(--background-modifier-hover);
  }
  .titlebar-button.mod-close:hover {
    background-color: var(--background-modifier-error);
  }

.mod-linux .titlebar-button.mod-close:hover,
  .mod-windows .titlebar-button.mod-close:hover {
    background-color: var(--background-modifier-error);
  }
  .mod-linux .titlebar-button.mod-close:hover .svg-icon,
  .mod-windows .titlebar-button.mod-close:hover .svg-icon {
    fill: white;
    stroke: white;
  }

body:not(.is-mobile) .workspace-split.mod-left-split .workspace-sidedock-vault-profile .workspace-drawer-vault-switcher:hover {
    color: var(--vault-profile-color-hover);
    background-color: var(--background-modifier-hover);
  }
  body:not(.is-mobile) .workspace-split.mod-left-split .workspace-sidedock-vault-profile .workspace-drawer-vault-switcher:hover .workspace-drawer-vault-switcher-icon {
    color: var(--text-muted);
  }

.workspace-leaf-resize-handle:hover {
    background-color: var(--divider-color-hover);
    border-color: var(--divider-color-hover);
  }
  .is-translucent .workspace-leaf-resize-handle:hover {
    background-color: var(--divider-color-hover);
    border-color: var(--divider-color-hover);
  }

.workspace-tab-header:not(.is-active):hover .workspace-tab-header-inner {
    background-color: var(--background-modifier-hover);
  }

.workspace-tab-header-inner:hover .workspace-tab-header-inner-icon {
    color: var(--icon-color-hover);
    opacity: var(--icon-opacity-hover);
  }

.workspace-tab-header.is-active .workspace-tab-header-status-icon:hover,
  .workspace-tab-header.is-active .workspace-tab-header-inner-close-button:hover {
    background-color: var(--background-modifier-hover);
  }
  .mod-root .workspace-tab-header.is-active .workspace-tab-header-status-icon.mod-linked:hover,
  .mod-root .workspace-tab-header.is-active .workspace-tab-header-inner-close-button.mod-linked:hover,
  .mod-root .workspace-tab-header.is-active .workspace-tab-header-status-icon.mod-pinned:hover,
  .mod-root .workspace-tab-header.is-active .workspace-tab-header-inner-close-button.mod-pinned:hover {
    background-color: var(--background-modifier-active-hover);
  }

.workspace-tab-header-inner-close-button:hover {
    color: var(--tab-text-color-focused-active-current);
  }

.workspace-tab-header:hover .workspace-tab-header-inner-close-button:hover {
    color: var(--tab-text-color-focused-active-current);
  }

.workspace-tab-header.is-active .workspace-tab-header-inner-close-button:hover {
    color: var(--tab-text-color-focused-active-current);
  }

.mod-left-split .workspace-tab-header.has-active-menu:hover,
  .mod-right-split .workspace-tab-header.has-active-menu:hover,
  .mod-left-split .workspace-tab-header.is-active:hover,
  .mod-right-split .workspace-tab-header.is-active:hover {
    background-color: var(--background-modifier-hover);
  }

.workspace .mod-root .workspace-tabs:not(.mod-stacked) .workspace-tab-header:hover .workspace-tab-header-inner-close-button {
    display: flex;
  }

.workspace .mod-root .workspace-tabs.mod-stacked .workspace-tab-container .workspace-tab-header:hover .workspace-tab-header-inner {
    background-color: transparent;
  }

.workspace .mod-root .workspace-tabs.mod-stacked .workspace-tab-container .workspace-tab-header-inner-icon:hover {
    background-color: var(--background-modifier-hover);
  }

.workspace .mod-root .workspace-tabs.mod-stacked .workspace-tab-container .workspace-tab-header-inner-close-button:hover {
    background-color: var(--background-modifier-hover);
  }

button:hover {
    background-color: var(--interactive-hover);
    box-shadow: var(--input-shadow-hover);
  }

button.mod-cta:hover {
    background-color: var(--interactive-accent-hover);
  }

button.mod-muted:hover {
    background-color: var(--background-secondary);
  }

button.mod-warning:hover {
    background-color: var(--background-modifier-error-hover);
  }

.card.u-clickable:hover {
    border: 1px solid var(--interactive-accent);
    background-color: hsla(var(--interactive-accent-hsl), 0.1);
  }

.list-item.mod-selectable:hover {
    background-color: var(--background-modifier-hover);
  }

.diff-collapsed:hover {
    color: var(--text-accent);
  }

.document-search-input.mod-no-match:hover,
  .document-replace-input.mod-no-match:hover {
    background-color: rgba(var(--background-modifier-error-rgb), 0.2);
  }

select:hover,
  .dropdown:hover {
    box-shadow: var(--input-shadow-hover);
    background-color: var(--dropdown-background-hover);
  }

.clickable-icon:hover {
    box-shadow: none;
    opacity: var(--icon-opacity-hover);
    color: var(--icon-color-hover);
    background-color: var(--background-modifier-hover);
  }
  .clickable-icon.has-active-menu,
  .clickable-icon:active {
    opacity: var(--icon-opacity-hover);
    color: var(--icon-color-focused);
    background-color: var(--background-modifier-hover);
  }

.clickable-icon.is-active:hover {
    background-color: var(--background-modifier-active-hover);
  }

.clickable-icon[aria-disabled='true']:hover {
    background-color: unset;
  }

.text-icon-button:hover {
    box-shadow: none;
    opacity: var(--icon-opacity-hover);
    background-color: var(--background-modifier-hover);
    color: var(--text-normal);
  }
  .text-icon-button:hover .text-button-icon {
    color: var(--icon-color-hover);
  }
  .text-icon-button.has-active-menu,
  .text-icon-button:active {
    opacity: var(--icon-opacity-hover);
    background-color: var(--background-modifier-hover);
    color: var(--text-normal);
  }
  .text-icon-button.has-active-menu .text-button-icon,
  .text-icon-button:active .text-button-icon {
    color: var(--icon-color-focused);
  }

.input-button:hover {
    color: var(--text-normal);
  }

textarea:hover,
  input.metadata-input-text:hover,
  input[type='date']:hover,
  input[type='datetime-local']:hover,
  input[type='text']:hover,
  input[type='search']:hover,
  input[type='email']:hover,
  input[type='password']:hover,
  input[type='number']:hover {
    border-color: var(--background-modifier-border-hover);
    transition: box-shadow 0.15s ease-in-out, border 0.15s ease-in-out;
  }

input[type="color"]::-webkit-color-swatch:hover {
    box-shadow: inset 0 0 0 1px rgba(var(--mono-rgb-100), 0.25), 0 0 0 3px var(--background-modifier-border-hover);
  }

.modal-close-button:hover {
    background-color: var(--background-modifier-hover);
    color: var(--text-normal);
  }

.multi-select-pill:hover {
    background-color: var(--pill-background-hover);
    border: var(--pill-border-width) solid var(--pill-border-color-hover);
    color: var(--pill-color-hover);
    text-decoration: var(--pill-decoration-hover);
  }

.multi-select-pill-remove-button:hover {
    color: var(--pill-color-remove-hover);
  }

.follow-link-popover:hover {
    background-color: #000000;
  }

.horizontal-tab-nav-item:hover,
  .vertical-tab-nav-item:hover {
    background-color: var(--background-modifier-hover);
  }

.checkbox-container:hover {
    box-shadow: inset 0 6px 20px rgba(0, 0, 0, 0.14), inset 0 0 1px rgba(0, 0, 0, 0.28);
  }

body:not(.is-grabbing) .tree-item-self.is-clickable:hover {
    color: var(--nav-item-color-hover);
    background-color: var(--nav-item-background-hover);
    font-weight: var(--nav-item-weight-hover);
  }

.tree-item-self:hover .tree-item-flair {
    color: var(--text-muted);
  }

.pdf-sidebar-resizer:hover {
    background-color: var(--divider-color-hover);
  }
  .is-translucent .pdf-sidebar-resizer:hover {
    background-color: var(--divider-color-hover);
  }

.markdown-rendered button.copy-code-button:hover {
    background-color: var(--background-modifier-hover);
  }

.markdown-source-view.mod-cm6 .code-block-flair:hover {
    background-color: var(--background-modifier-hover);
  }

.markdown-source-view.mod-cm6 .pdf-embed .edit-block-button:hover {
    color: var(--icon-color-hover);
    background-color: var(--background-modifier-hover);
  }

.markdown-embed-link:hover,
  .file-embed-link:hover {
    color: var(--icon-color-hover);
    opacity: var(--icon-opacity-hover);
    background: var(--background-modifier-hover);
  }

.file-embed.mod-generic:hover,
  .file-embed.mod-empty:hover {
    color: var(--text-normal);
    background-color: var(--background-secondary);
  }

.markdown-source-view.mod-cm6 .cm-embed-block:not(.cm-table-widget):hover {
    box-shadow: var(--embed-block-shadow-hover);
    border-radius: var(--radius-s);
    overflow: hidden;
    cursor: text;
  }
  .markdown-source-view.mod-cm6 .cm-embed-block:not(.cm-table-widget):hover .edit-block-button {
    opacity: 1;
  }
  .markdown-source-view.mod-cm6 .cm-embed-block:not(.cm-table-widget):hover .edit-block-button:hover {
    background-color: var(--background-modifier-hover);
  }

.footnote-backref:hover {
    color: var(--text-accent);
    text-decoration: none;
  }

.cm-s-obsidian .cm-line.HyperMD-footnote span.cm-hmd-footnote .cm-underline:hover {
    cursor: text;
    color: var(--text-muted);
    text-decoration: none;
  }

.metadata-property:hover {
    --metadata-divider-color: var(--metadata-divider-color-hover);
    border-radius: var(--metadata-property-radius-focus);
    background-color: var(--metadata-property-background-hover);
    box-shadow: 0 0 0 1px var(--background-modifier-border);
    border-radius: var(--metadata-property-radius-hover);
  }

.metadata-property-icon:hover .svg-icon {
    color: var(--icon-color-focused);
  }

.metadata-property-key:hover {
    background-color: var(--metadata-label-background-hover);
  }

input.metadata-property-key-input:hover {
    background-color: transparent;
  }

.metadata-property-warning-icon:hover {
    color: var(--text-warning);
    background-color: rgba(var(--color-orange-rgb), 0.15);
  }

.metadata-property-value.mod-external-link:not(:placeholder-shown) .metadata-link-inner:hover {
    text-decoration-line: var(--link-decoration-hover);
  }

.metadata-property-value:hover {
    background-color: var(--metadata-input-background-hover);
  }

.metadata-link:hover .metadata-link-flair {
    opacity: var(--icon-opacity);
    transition: 0.1s opacity 0.25s ease-in-out;
  }

.metadata-link-inner:hover {
    text-decoration-line: var(--link-decoration-hover);
    color: var(--link-color-hover);
  }
  .metadata-link-inner:hover ~ .metadata-link-flair {
    opacity: 0;
  }

.cm-s-obsidian .hmd-fold-html:hover {
    border: 1px dashed #999;
  }

.list-collapse-indicator:hover ~ .list-bullet:after,
  .cm-fold-indicator:hover ~ .list-bullet:after,
  .list-collapse-indicator:hover ~ .cm-formatting-list .list-bullet:after,
  .cm-fold-indicator:hover ~ .cm-formatting-list .list-bullet:after {
    background-color: var(--list-marker-color-hover);
    box-shadow: 0 0 0 4px var(--background-modifier-hover);
  }
  li.is-collapsed .list-collapse-indicator:hover ~ .list-bullet:after,
  li.is-collapsed .cm-fold-indicator:hover ~ .list-bullet:after,
  .list-collapse-indicator:hover.is-collapsed ~ .list-bullet:after,
  .cm-fold-indicator:hover.is-collapsed ~ .list-bullet:after,
  li.is-collapsed .list-collapse-indicator:hover ~ .cm-formatting-list .list-bullet:after,
  li.is-collapsed .cm-fold-indicator:hover ~ .cm-formatting-list .list-bullet:after,
  .list-collapse-indicator:hover.is-collapsed ~ .cm-formatting-list .list-bullet:after,
  .cm-fold-indicator:hover.is-collapsed ~ .cm-formatting-list .list-bullet:after {
    background-color: var(--list-marker-color-collapsed);
    box-shadow: 0 0 0 4px var(--background-modifier-active-hover);
  }

a:hover {
    color: var(--link-color-hover);
    text-decoration-line: var(--link-decoration-hover);
  }

.external-link:hover {
    color: var(--link-external-color-hover);
    text-decoration-line: var(--link-external-decoration-hover);
  }

.metadata-container .internal-link:hover,
  .markdown-rendered .internal-link:hover {
    color: var(--link-color-hover);
    text-decoration-line: var(--link-decoration-hover);
  }

.metadata-container .internal-link.is-unresolved:hover,
  .markdown-rendered .internal-link.is-unresolved:hover {
    opacity: 1;
    color: var(--link-color-hover);
    text-decoration-color: var(--link-color-hover);
    text-decoration-line: var(--link-decoration-hover);
  }

.cm-s-obsidian span.cm-hmd-internal-link:hover {
    text-decoration-line: var(--link-decoration-hover);
    color: var(--link-color-hover);
  }

.cm-s-obsidian span.cm-link:hover {
    color: var(--link-external-color-hover);
    text-decoration-line: var(--link-external-decoration-hover);
  }

.cm-s-obsidian span.cm-formatting-link.cm-url:hover,
  .cm-s-obsidian span.cm-url:hover {
    color: var(--link-external-color-hover);
    text-decoration-line: var(--link-external-decoration-hover);
  }

.cm-s-obsidian span.hmd-link-icon:hover {
    opacity: 1;
  }

.markdown-source-view.mod-cm6 .is-unresolved:hover {
    opacity: 1;
    color: var(--link-color-hover);
    text-decoration-color: var(--link-color-hover);
  }

.markdown-source-view.mod-cm6 .cm-hmd-internal-link .cm-underline:hover {
    text-decoration-line: var(--link-decoration-hover);
  }

.markdown-source-view.mod-cm6 .cm-link .cm-underline:hover,
  .markdown-source-view.mod-cm6 .cm-url .cm-underline:hover {
    color: var(--link-external-color-hover);
    text-decoration-line: var(--link-external-decoration-hover);
  }

.cm-s-obsidian div.HyperMD-goback-button:hover {
    color: transparent;
    text-align: left;
  }
  .cm-s-obsidian div.HyperMD-goback-button:hover:before {
    position: absolute;
    padding-left: 5px;
    content: "Back";
    color: #f7f7f7;
  }

.cm-html-embed tbody tr:hover,
  .markdown-rendered tbody tr:hover {
    background-color: var(--table-row-background-hover);
  }

.cm-html-embed tbody tr:nth-child(odd):hover,
  .markdown-rendered tbody tr:nth-child(odd):hover {
    background-color: var(--table-row-alt-background-hover);
  }

.cm-html-embed thead tr:hover,
  .markdown-rendered thead tr:hover {
    background-color: var(--table-header-background-hover);
  }

a.tag:hover {
    background-color: var(--tag-background-hover);
    border: var(--tag-border-width) solid var(--tag-border-color-hover);
    color: var(--tag-color-hover);
    text-decoration: var(--tag-decoration-hover);
  }

a.tag:hover {
    background-color: var(--tag-background-hover);
    border: var(--tag-border-width) solid var(--tag-border-color-hover);
    color: var(--tag-color-hover);
    text-decoration: var(--tag-decoration-hover);
  }

input[type=checkbox]:checked:hover {
    background-color: var(--checkbox-color-hover);
    border-color: var(--checkbox-color-hover);
  }

.backlink-pane > .tree-item-self.is-clickable.is-collapsed:hover,
  .outgoing-link-pane > .tree-item-self.is-clickable.is-collapsed:hover {
    color: var(--nav-heading-color-collapsed-hover);
  }

.backlink-pane > .tree-item-self:hover,
  .outgoing-link-pane > .tree-item-self:hover {
    color: var(--nav-heading-color-hover);
    font-weight: var(--nav-heading-weight-hover);
  }

body:not(.is-grabbing) .nav-file-title:hover,
  body:not(.is-grabbing) .nav-folder-title:hover {
    background-color: var(--nav-item-background-hover);
    color: var(--nav-item-color-hover);
    font-weight: var(--nav-item-weight-hover);
  }

.file-recovery-list-item-header:hover {
    background-color: var(--background-modifier-hover);
  }

.publish-section-header-text:hover,
  .publish-section-header-toggle-collapsed-button:hover,
  .publish-section-header-action:hover {
    color: var(--text-accent-hover);
  }

.password-item:hover {
    background-color: var(--background-primary);
  }

.search-input-suggest-button:hover {
    color: var(--text-muted);
  }

.search-suggest-icon:hover {
    background-color: var(--background-modifier-hover);
  }

.search-result-file-match:hover {
    color: var(--text-normal);
    background-color: var(--text-selection);
  }
  .search-result-file-match:hover .search-result-file-match-replace-button {
    display: block;
  }

.search-result-file-match-replace-button:hover {
    color: var(--text-normal);
  }

.search-result-hover-button:hover {
    opacity: 1;
    background-color: var(--background-modifier-hover);
  }

.search-result-file-match:hover .search-result-file-match-destination-file {
    background-color: var(--background-secondary);
  }
  .search-result-file-match:hover .search-result-file-match-destination-file:hover {
    background-color: var(--interactive-hover);
    box-shadow: var(--input-shadow-hover);
    color: var(--text-normal);
  }

.search-results-info .dropdown:hover {
    color: var(--interactive-accent);
  }

.slides-close-btn:hover {
    color: var(--text-muted);
  }

.sync-history-list-item-header.is-active:hover {
    --nav-collapse-icon-color: var(--text-on-accent);
  }

.sync-history-list-item-header.is-active .tree-item-flair:hover {
    --nav-collapse-icon-color: var(--text-on-accent);
  }

.sync-history-list-item-header:hover {
    background-color: var(--background-modifier-hover);
  }

.sync-history-list-item-header .tree-item-flair:hover {
    opacity: 1;
    background-color: var(--background-modifier-hover);
    --nav-collapse-icon-color: var(--text-normal);
  }

.sync-history-list-item .version-group-container .version-group-item:hover {
    background-color: var(--background-modifier-hover);
  }

button.sync-history-load-more-button:hover {
    background-color: var(--background-modifier-hover);
    box-shadow: none;
  }

.recent-changes-container .tree-item.nav-folder.is-collapsed .nav-folder-title:hover {
    color: var(--nav-heading-color-collapsed-hover);
  }

.tag-pane-tag.is-active:hover {
    background-color: var(--interactive-accent);
    color: var(--text-on-accent);
  }

.canvas-card-menu .canvas-card-menu-button:hover {
    color: var(--color-accent);
  }

.canvas-card-menu .canvas-card-menu-button.mod-draggable:hover svg {
    transform: translateY(-6px) scale(var(--direction), 1);
    filter: drop-shadow(0px 6px 2px rgba(0, 0, 0, 0.1));
  }

.canvas-control-item:hover {
    color: var(--text-normal);
    background-color: var(--interactive-hover);
  }

.canvas-node-label:hover {
    color: var(--text-muted);
  }
  .canvas-node:hover .canvas-node-label.mod-hover-label {
    opacity: 1;
  }

.canvas-color-picker-item:hover {
    box-shadow: 0 0 0 2px rgb(var(--canvas-color));
  }

.canvas-color-picker-item.canvas-color-picker-custom:not(.is-active):hover {
    box-shadow: 0 0 0 2px var(--background-modifier-border-hover);
  }

.open-vault-options .back-button:hover {
    color: var(--text-normal);
  }

.setting-item.mod-change-language .setting-item-name:hover {
    color: var(--text-muted);
  }

.recent-vaults-list-item:hover {
    background-color: var(--background-modifier-hover);
    color: var(--text-on-accent);
  }

LICENSE

Copyright 2025 Unxok

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.