← All changes | admin/resources/contextmenu.css +185 -0 1.6.0 → 1.8.16 View file →

		@@ -1,0 +1,185 @@
	1	+/**
	2	+ * Context menu
	3	+ */
	4	+
	5	+.vik-context-menu {
	6	+ position: absolute;
	7	+ background: #f6f6f6;
	8	+ opacity: 0.95;
	9	+ display: block;
	10	+ width: auto;
	11	+ max-width: 400px;
	12	+ min-width: 160px;
	13	+ max-height: calc(100vh - 8px);
	14	+ overflow-y: scroll;
	15	+ border-radius: 4px;
	16	+ -webkit-box-shadow: 0px 0px 6px 1px rgba(136,136,136,1);
	17	+ -moz-box-shadow: 0px 0px 6px 1px rgba(136,136,136,1);
	18	+ box-shadow: 0px 0px 6px 1px rgba(136,136,136,1);
	19	+ z-index: 2147483647;
	20	+}
	21	+.vik-context-menu::-webkit-scrollbar {
	22	+ display: none;
	23	+}
	24	+.vik-context-menu ul {
	25	+ list-style: none;
	26	+ margin: 0;
	27	+ padding: 0;
	28	+}
	29	+.vik-context-menu li {
	30	+ padding: 0;
	31	+ margin: 0;
	32	+}
	33	+.vik-context-menu li:first-child {
	34	+ padding-top: 4px;
	35	+}
	36	+.vik-context-menu li:last-child {
	37	+ padding-bottom: 4px;
	38	+}
	39	+.vik-context-menu li.separator:not(:last-child) {
	40	+ border-bottom: 2px solid #e6e6e6;
	41	+ padding-bottom: 4px;
	42	+ margin-bottom: 4px;
	43	+}
	44	+.vik-context-menu li a.btngroup {
	45	+ padding-left: 8px;
	46	+ font-size: smaller;
	47	+}
	48	+.vik-context-menu li a {
	49	+ font-family: Helvetica;
	50	+ display: flex;
	51	+ align-items: center;
	52	+ text-decoration: none;
	53	+ color: #434355;
	54	+ cursor: default;
	55	+ padding: 6px 8px 6px 16px;
	56	+ font-size: 14px;
	57	+}
	58	+.vik-context-menu li a:not(.disabled):hover {
	59	+ color: #fff;
	60	+ background: #218cf2;
	61	+}
	62	+.vik-context-menu li a.disabled {
	63	+ opacity: 0.6;
	64	+}
	65	+.vik-context-menu li a.disabled:hover {
	66	+ color: #434355;
	67	+}
	68	+.vik-context-menu li a .button-icon {
	69	+ margin-right: 4px;
	70	+ font-size: 16px;
	71	+}
	72	+.vik-context-menu li a .button-icon img {
	73	+ max-width: 16px;
	74	+ max-height: 16px;
	75	+}
	76	+.vik-context-menu li a .button-text {
	77	+ flex: 1;
	78	+}
	79	+
	80	+.vik-context-menu li.search-box {
	81	+ padding: 6px !important;
	82	+ position: relative;
	83	+}
	84	+.vik-context-menu li.search-box input {
	85	+ width: 100%;
	86	+ box-sizing: border-box;
	87	+ background: #fff;
	88	+ border: 1px solid #ddd;
	89	+ color: #333;
	90	+ border-radius: 4px;
	91	+ padding: 8px 26px 8px 8px;
	92	+ outline: none;
	93	+ font-size: 14px;
	94	+}
	95	+.vik-context-menu li.search-box input:focus {
	96	+ border-color: #1674b8;
	97	+}
	98	+.vik-context-menu li.search-box button.search-clear {
	99	+ position: absolute;
	100	+ top: 50%;
	101	+ right: 14px;
	102	+ transform: translateY(-50%);
	103	+ display: inline-flex;
	104	+ padding: 0;
	105	+ appearance: none;
	106	+ background: none;
	107	+ border: none;
	108	+ outline: none;
	109	+ font-size: 14px;
	110	+ cursor: pointer;
	111	+}
	112	+.vik-context-menu li.search-box button.search-clear:hover {
	113	+ color: #218cf2 !important;
	114	+}
	115	+
	116	+/**
	117	+ * Dark Mode
	118	+ */
	119	+
	120	+.vik-context-menu.dark-mode {
	121	+ background: #1f1c1c;
	122	+ -webkit-box-shadow: 0px 0px 6px 1px rgba(100,100,100,1);
	123	+ -moz-box-shadow: 0px 0px 6px 1px rgba(100,100,100,1);
	124	+ box-shadow: 0px 0px 6px 1px rgba(100,100,100,1);
	125	+}
	126	+.vik-context-menu.dark-mode li.separator:not(:last-child) {
	127	+ border-bottom: 2px solid #3b3b3b;
	128	+}
	129	+.vik-context-menu.dark-mode li a,
	130	+.vik-context-menu.dark-mode li a.disabled:hover {
	131	+ color: #fff;
	132	+}
	133	+.vik-context-menu.dark-mode li.search-box input {
	134	+ background: #333;
	135	+ border-color: 1px solid #777;
	136	+ color: #fff;
	137	+}
	138	+.vik-context-menu.dark-mode li.search-box button.search-clear {
	139	+ color: #fff;
	140	+}
	141	+
	142	+@media (prefers-color-scheme: dark) {
	143	+ .vik-context-menu:not(.light-mode) {
	144	+ background: #1f1c1c;
	145	+ -webkit-box-shadow: 0px 0px 6px 1px rgba(100,100,100,1);
	146	+ -moz-box-shadow: 0px 0px 6px 1px rgba(100,100,100,1);
	147	+ box-shadow: 0px 0px 6px 1px rgba(100,100,100,1);
	148	+ }
	149	+ .vik-context-menu:not(.light-mode) li.separator:not(:last-child) {
	150	+ border-bottom: 2px solid #3b3b3b;
	151	+ }
	152	+ .vik-context-menu:not(.light-mode) li a,
	153	+ .vik-context-menu:not(.light-mode) li a.disabled:hover {
	154	+ color: #fff;
	155	+ }
	156	+ .vik-context-menu:not(.light-mode) li.search-box input {
	157	+ background: #333;
	158	+ border-color: 1px solid #777;
	159	+ color: #fff;
	160	+ }
	161	+ .vik-context-menu:not(.light-mode) li.search-box button.search-clear {
	162	+ color: #fff;
	163	+ }
	164	+}
	165	+
	166	+/**
	167	+ * Utils
	168	+ */
	169	+
	170	+/* hack used to disable the browser selection */
	171	+.vik-context-menu-disable-selection {
	172	+ cursor: pointer;
	173	+ -webkit-touch-callout: none; /* iOS Safari */
	174	+ -webkit-user-select: none; /* Safari */
	175	+ -khtml-user-select: none; /* Konqueror HTML */
	176	+ -moz-user-select: none; /* Old versions of Firefox */
	177	+ -ms-user-select: none; /* Internet Explorer/Edge */
	178	+ user-select: none; /* Non-prefixed version, currently
	179	+ supported by Chrome, Edge, Opera and Firefox */
	180	+}
	181	+
	182	+/* hack used to lock the document scroll */
	183	+body.lock-scroll {
	184	+ overflow: hidden;
	185	+}