]>
git.gir.st - VimFx.git/blob - extension/skin/style.css
2 * Copyright Simon Lydell 2015.
4 * This file is part of VimFx.
6 * VimFx is free software: you can redistribute it and/or modify
7 * it under the terms of the GNU General Public License as published by
8 * the Free Software Foundation, either version 3 of the License, or
9 * (at your option) any later version.
11 * VimFx is distributed in the hope that it will be useful,
12 * but WITHOUT ANY WARRANTY; without even the implied warranty of
13 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
14 * GNU General Public License for more details.
16 * You should have received a copy of the GNU General Public License
17 * along with VimFx. If not, see <http://www.gnu.org/licenses/>.
20 /* Allow file:/// prefix for testing using `gulp help.html`. */
21 @-moz-document url
(chrome://browser
/content
/browser
.xul
), url-prefix
(file:///)
27 list-style-image: url
(icon16.png);
30 #VimFxButton[cui-areatype
="menu-panel"],
31 toolbarpaletteitem
[place
="palette"] > #VimFxButton
{
32 list-style-image: url
(icon32.png);
35 @media (min-resolution: 2dppx) {
37 list-style-image: url
(icon32.png);
40 #VimFxButton[cui-areatype
="menu-panel"],
41 toolbarpaletteitem
[place
="palette"] > #VimFxButton
{
42 list-style-image: url
(icon64.png);
46 #VimFxButton[vimfx-mode
="insert"] {
47 filter: grayscale
(100%);
52 /* All styles below are intentionally very generic to fit with the user’s system
59 #VimFxMarkersContainer {
63 /* Marker styles should be kept simple for performance. */
64 #VimFxMarkersContainer .marker
{
67 border: solid
1px #ad810c;
68 background-color: #ffd76e;
71 font-family: sans-serif
;
73 text-transform: uppercase
;
77 #VimFxMarkersContainer .marker-char
{} /* Keep as documentation. */
79 #VimFxMarkersContainer .marker--matched
,
80 #VimFxMarkersContainer .marker-char--matched
{
84 #VimFxMarkersContainer .marker--hidden
{
90 /***** Help Dialog *****/
92 #VimFxHelpDialogContainer {
98 background-color: Window
;
104 padding-top: calc
(var
(--page-padding
) / 2);
105 padding-left: calc
(var
(--page-padding
) - var
(--gutter
));
106 padding-right: var
(--page-padding
);
109 #VimFxHelpDialogContainer * {
111 -moz-user-select: text
;
114 #VimFxHelpDialogContainer :-moz-any
([class^
="heading"], .key-sequence
) {
119 #VimFxHelpDialogContainer .header
{
121 margin-left: var
(--gutter
);
122 margin-bottom: calc
(var
(--page-padding
) / 4);
125 #VimFxHelpDialogContainer .heading-main
{
127 /* Add space for the close button. */
131 #VimFxHelpDialogContainer .name
{
133 margin-left: -0.45ch;
137 #VimFxHelpDialogContainer .title
{
143 #VimFxHelpDialogContainer .close-button
{
148 -moz-user-select: none
;
151 #VimFxHelpDialogContainer .close-button:hover
{
155 #VimFxHelpDialogContainer .content
{
160 #VimFxHelpDialogContainer .category
{
162 margin-left: var
(--gutter
);
163 margin-bottom: calc
(var
(--page-padding
) / 2);
166 #VimFxHelpDialogContainer .heading-mode
,
167 #VimFxHelpDialogContainer .category:not
(.first
)::before
{
171 #VimFxHelpDialogContainer .category:not
(.first
)::before
{
172 /* Insert newline the same size as a `.heading-mode` to vertically align all
173 * `.heading-category`s. */
178 #VimFxHelpDialogContainer .heading-category
{
182 #VimFxHelpDialogContainer .command
{
189 #VimFxHelpDialogContainer .key-sequence
{
194 #VimFxHelpDialogContainer .key-sequence:last-of-type
{
198 #VimFxHelpDialogContainer .description
{
200 /* The space to the left should be wide enough to fit `<c-w>`. */
201 width: calc
(100% - 3.5em);