Created
June 28, 2019 12:06
-
-
Save maricn/55898225d2434f3ca3da3185d5e33e1f to your computer and use it in GitHub Desktop.
My Dark (orange side) Vimium CSS with vomnibar
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| div > .vimiumHintMarker { | |
| /* linkhint boxes */ | |
| /* background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFF785), | |
| color-stop(100%,#FFC542)); */ | |
| background: #383c4a; | |
| border: 1px solid #E3BE23; | |
| } | |
| div > .vimiumHintMarker span { | |
| /* linkhint text */ | |
| color: #a2a3a7; | |
| font-weight: bold; | |
| } | |
| /* | |
| Arc Dark theme for styling Vimium link hints | |
| By Giorgi Gzirishvili (@giogziro95). This code is in the public domain. | |
| To use: | |
| 1. Copy the code. | |
| 2. Go to the Vimium options. | |
| 3. Click Show Advanced Options. | |
| 4. Under Advanced Options, scroll down to CSS for link hints. | |
| 5. Paste the code in the text field. | |
| 6. Click Save Changes. | |
| 7. Go to the website of your choice (or, if you have it open already, reload it) and check out the results. | |
| */ | |
| /* Arc Dark theme */ | |
| /* Link hint boxes */ | |
| div > .vimiumHintMarker { | |
| background: #40424a; | |
| font-size: 14px; | |
| border: 0.25em solid #383c4a; | |
| border-radius: 0.28em; | |
| box-shadow: 0em 0.1em 0.25em 0.1em rgba(0, 0, 0, 0.4); | |
| } | |
| /* Link hint text */ | |
| div > .vimiumHintMarker span { | |
| /* color: #5294e2;*/ | |
| color: #e2e3e7; | |
| font-size: inherit; | |
| text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; | |
| } | |
| /* Link hint matching characters */ | |
| div > .vimiumHintMarker > .matchingCharacter { | |
| /* color: #e2e3e7;*/ | |
| /* color: #5294e2;*/ | |
| color: #c74; | |
| text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; | |
| } | |
| /* Vomnibar Dark CSS */ | |
| #vomnibar ol, #vomnibar ul { | |
| list-style: none; | |
| display: none; | |
| } | |
| #vomnibar { | |
| display: block; | |
| position: fixed; | |
| width: calc(100% - 20px); /* adjusted to keep border radius and box-shadow visible*/ | |
| /*min-width: 400px; | |
| top: 70px; | |
| left: 50%;*/ | |
| top: 8px; | |
| left: 8px; | |
| /*margin: 0 0 0 -40%;*/ | |
| font-family: sans-serif; | |
| background: #101010; | |
| text-align: left; | |
| border-radius: 4px; | |
| box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.8); | |
| border: 1px solid #101010; | |
| z-index: 2139999999; /* One less than hint markers and the help dialog (see ../content_scripts/vimium.css). */ | |
| } | |
| #vomnibar input { | |
| color: #cecece; | |
| font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; | |
| font-size: 20px; | |
| height: 34px; | |
| margin-bottom: 0; | |
| padding: 4px; | |
| background-color: #333; | |
| border-radius: 3px; | |
| border: 1px solid #333; | |
| box-shadow: #333 0px 0px 1px; | |
| width: 100%; | |
| outline: none; | |
| box-sizing: border-box; | |
| } | |
| #vomnibar .vomnibarSearchArea { | |
| display: block; | |
| padding: 10px; | |
| background-color: #111; | |
| border-radius: 4px 4px 0 0; | |
| border-bottom: 1px solid #333; | |
| } | |
| #vomnibar ul { | |
| background-color: #222; | |
| border-radius: 0 0 4px 4px; | |
| list-style: none; | |
| padding: 10px 0; | |
| padding-top: 0; | |
| } | |
| #vomnibar li { | |
| border-bottom: 1px solid #3c3c3c; | |
| line-height: 1.1em; | |
| padding: 7px 10px; | |
| font-size: 16px; | |
| color: #b7b7b7; | |
| position: relative; | |
| display: list-item; | |
| margin: auto; | |
| } | |
| #vomnibar li:last-of-type { | |
| border-bottom: none; | |
| } | |
| #vomnibar li .vomnibarTopHalf, #vomnibar li .vomnibarBottomHalf { | |
| display: block; | |
| overflow: hidden; | |
| } | |
| #vomnibar li .vomnibarBottomHalf { | |
| font-size: 15px; | |
| margin-top: 3px; | |
| padding: 2px 0; | |
| } | |
| #vomnibar li .vomnibarIcon { | |
| background-position-y: center; | |
| background-size: 16px; | |
| background-repeat: no-repeat; | |
| padding-left: 20px; | |
| } | |
| #vomnibar li .vomnibarSource { | |
| color: #7b7b7b; | |
| margin-right: 4px; | |
| } | |
| #vomnibar li .vomnibarRelevancy { | |
| position: absolute; | |
| right: 0; | |
| top: 0; | |
| padding: 5px; | |
| background-color: #797979; | |
| color: white; | |
| font-family: monospace; | |
| width: 100px; | |
| overflow: hidden; | |
| } | |
| #vomnibar li .vomnibarUrl { | |
| white-space: nowrap; | |
| color: #488bca; | |
| } | |
| #vomnibar li .vomnibarMatch { | |
| font-weight: bold; | |
| color: #50a7ea; | |
| } | |
| #vomnibar li em, #vomnibar li .vomnibarTitle { | |
| color: #999; | |
| margin-left: 4px; | |
| font-weight: normal; | |
| } | |
| #vomnibar li em { font-style: italic; } | |
| #vomnibar li em .vomnibarMatch, #vomnibar li .vomnibarTitle .vomnibarMatch { | |
| color: #aaa; | |
| } | |
| #vomnibar li.vomnibarSelected { | |
| background-color: #101010; | |
| font-weight: normal; | |
| } | |
| #vomnibarInput::selection { | |
| background-color: #E6EEFB; | |
| } | |
| .vomnibarInsertText { | |
| } | |
| .vomnibarNoInsertText { | |
| visibility: hidden; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment