/* ============================================================================ cursors.css — custom Windows-style cursor theme (app-wide). Files live in wwwroot/img/cursors/. Spaces in filenames are URL-encoded (%20). Every rule pairs the custom cursor with a standard keyword fallback so browsers that can't load the file still show a sensible cursor. This sheet is loaded last so it overrides framework cursor rules; !important on the common states guarantees they win regardless of selector specificity elsewhere. ========================================================================== */ /* ---- Default ------------------------------------------------------------- */ /* `cursor` is inherited, so this cascades to everything that doesn't set its own. */ html, body { cursor: url("/img/cursors/Normal%20Select.cur"), auto; } /* The framework sets `cursor: default` (system arrow) on role'd lists (win7.css `ul[role]`), which wins over the inherited custom default on the header's menu bar. Force the custom default arrow on the header + menu containers; the menu items themselves keep Link Select from the rule below. */ header, ul[role], menu[role] { cursor: url("/img/cursors/Normal%20Select.cur"), auto !important; } /* ---- Clickable / pointer -> Link Select -------------------------------- */ a, button, .Button, [role="button"], [role="tab"], [role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [role="link"], [role="option"], input[type="button"], input[type="submit"], input[type="reset"], input[type="checkbox"], input[type="radio"], input[type="file"], input[type="image"], input[type="range"], input[type="color"], select, summary, label[for], .video-feed-container, .news-feed-container, .twitter-card, .view-count-container, .hackernews-feed-container, .ticker_item, .login-button, .datasource-row, .article-row, [onclick] { cursor: url("/img/cursors/Link%20Select.cur"), pointer !important; } /* ---- Text fields -> Text Select ---------------------------------------- */ input[type="text"], input[type="search"], input[type="email"], input[type="password"], input[type="url"], input[type="tel"], input[type="number"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="time"], input:not([type]), textarea, [contenteditable="true"], [contenteditable=""] { cursor: url("/img/cursors/Text%20Select.cur"), text !important; } /* ---- Disabled / not allowed -> Unavailable ----------------------------- */ :disabled, [disabled], [aria-disabled="true"], .disabled { cursor: url("/img/cursors/Unavailable.cur"), not-allowed !important; } /* ---- Busy -> Busy Modern (.ani; see loading note below re: animation) --- */ [aria-busy="true"], .busy { cursor: url("/img/cursors/Busy%20Modern.ani"), wait !important; } /* ---- Help -> Help Select ----------------------------------------------- */ abbr[title], [role="tooltip"], .cursor-help { cursor: url("/img/cursors/Help%20Select.cur"), help !important; } /* ---- Opt-in utility classes for the rarer cursors ------------------------ */ [draggable="true"], .cursor-move { cursor: url("/img/cursors/Move.cur"), move !important; } .cursor-crosshair { cursor: url("/img/cursors/Precision%20Select.cur"), crosshair !important; } .cursor-ew-resize { cursor: url("/img/cursors/Horizontal%20Resize.cur"), ew-resize !important; } .cursor-ns-resize { cursor: url("/img/cursors/Vertical%20Resize.cur"), ns-resize !important; } .cursor-nwse-resize { cursor: url("/img/cursors/Diagonal%20Resize%201.cur"), nwse-resize !important; } .cursor-nesw-resize { cursor: url("/img/cursors/Diagonal%20Resize%202.cur"), nesw-resize !important; } .cursor-context-menu { cursor: url("/img/cursors/Alternate%20Select.cur"), context-menu !important; } /* ---- Page-load cursor -> Working In Background Modern ------------------- */ /* is set in the layout and removed on window 'load', so this shows on everything until the page finishes loading. NOTE: animated .ani cursors are NOT rendered by Chromium/Firefox for CSS cursors, so on those browsers the built-in `progress` fallback (arrow + OS spinner) shows instead. */ html.page-loading, html.page-loading * { cursor: url("/img/cursors/Working%20In%20Background%20Modern.ani"), progress !important; }