Skip to main content
aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat (limited to 'org.eclipse.help.webapp/m/index.css')
-rw-r--r--org.eclipse.help.webapp/m/index.css668
1 files changed, 668 insertions, 0 deletions
diff --git a/org.eclipse.help.webapp/m/index.css b/org.eclipse.help.webapp/m/index.css
new file mode 100644
index 000000000..2595bff90
--- /dev/null
+++ b/org.eclipse.help.webapp/m/index.css
@@ -0,0 +1,668 @@
+/*******************************************************************************
+ * Copyright (c) 2020 Holger Voormann and others.
+ *
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *******************************************************************************
+
+ Structure:
+ ____________________________________________
+ | #h(eader) |
+ |--------------------------------------------|
+ | #m(ain area) |
+ | ________________________________________ |
+ | | | | | |
+ | | #t(oc) | #s(lider) | #c(ontent iframe) | |
+ | |________|___________|___________________| |
+ |--------------------------------------------|
+ | #f(ooter) |
+ |____________________________________________|
+
+ *******************************************************************************/
+* {
+ border: 0;
+ margin: 0;
+ padding: 0;
+}
+input:focus {
+ outline: none;
+}
+html, body, #m {
+ height: 100%;
+ overflow: hidden;
+}
+body, input, button {
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Lucida Grande", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+ font-size: 1rem;
+ color: #222;
+}
+body {
+ display: -webkit-flex;
+ display: flex;
+ -webkit-flex-flow: column;
+ flex-flow: column;
+ background: #eef0f3;
+}
+a {
+ text-decoration: none;
+}
+strong {
+ color: #444;
+}
+button {
+ background: transparent;
+ font-size: 1em;
+ cursor: pointer;
+}
+#h {
+ padding: 6px 6px 4px;
+ display: flex;
+}
+#m {
+ width: 100%;
+ height: 100%;
+ padding: 2px 0 0;
+ -webkit-flex: 0 1 auto;
+ flex: 0 1 auto;
+ display: -webkit-flex;
+ display: flex;
+}
+#t {
+ width: 400px;
+ overflow: auto;
+ scroll-behavior: smooth;
+}
+#t.hide {
+ -ms-overflow-style: -ms-autohiding-scrollbar; /* IE and Edge: avoid that the scrollbar is shown even when TOC is hidden */
+}
+#t .tree {
+ padding-top: 6px;
+}
+#s {
+ width: 12px;
+ z-index: 2;
+ cursor: e-resize;
+}
+#c, .c {
+ -webkit-flex: auto;
+ flex: auto;
+}
+.c {
+ overflow: auto;
+ flex-basis: 0;
+}
+#t, #c, .c {
+ height: 1px;
+ min-height: 100%;
+ max-height: 100%;
+}
+#t, #c, .c, .qf, #a {
+ background: #fff;
+ box-shadow: 0 1px 3px rgba(0,0,0,0.15);
+}
+
+#f { display: none; }
+
+/*** main toolbar (in the upper left) ***/
+.y {
+ display: flex;
+ margin-right: 6px;
+}
+
+/*** button ***/
+.b {
+ display: inline-block;
+ padding: 8px;
+ font-size: 0;
+ color: #555;
+ background: transparent;
+ box-sizing: content-box;
+ height: 20px;
+ width: 20px;
+}
+.b:hover, #h .q0 > .b:hover {
+ background: #d7d9db;
+ border-radius: 5px;
+}
+
+/*** search field (area) ***/
+.q0 {
+ flex: auto;
+ display: flex;
+}
+.q1 {
+ position: relative;
+ max-width: 640px;
+ flex: auto;
+}
+.q, .qf, .qm {
+ display: flex;
+ border-radius: 8px;
+ background: #fff;
+}
+.q {
+ border: 1px solid #fff;
+ box-shadow: 0 1px 1px rgba(0,0,0,0.05);
+}
+.qf, .qm {
+ border: 1px solid #37e;
+ box-shadow: 0 1px 3px rgba(119,153,238,0.4);
+}
+.qm {
+ border-radius: 8px 8px 2px 0;
+ border-bottom-color: rgba(255,255,255,0);
+}
+.q0 .b:hover {
+ background: none;
+}
+.qf.qa .b, .qm.qa .b, .q.qa .b:hover, #b .a .b, #b .a .b:hover {
+ color: #fff;
+ background: #37e;
+ margin: 0 -0.5px 0 0; /* workaround for Microsoft Edge to avoid white between blue button and blue border */
+}
+.qf.qa .b {
+ border-radius: 0 7px 7px 0;
+}
+.qm.qa .b {
+ border-radius: 0 7px 0 0;
+}
+.q .b:hover {
+ background: #fff;
+ cursor: default;
+}
+.q0 .b {
+ border-radius: 7px;
+ margin: 0;
+ padding: 7.8px;
+}
+.q .b, .qf .b {
+ cursor: default;
+}
+.q2 {
+ display: flex;
+ flex: auto;
+}
+.q2, .q1 .b {
+ z-index: 2;
+}
+#q, .qh {
+ width: 100%; /* needed for some mobiles where "flex: auto" is not enough or does not work */
+ flex: auto;
+ min-width: 24px;
+ border: 0;
+ margin: 2px 0;
+ font-size: 1rem;
+ background: #fff;
+}
+.qh {
+ margin: 0;
+ color: #ddd;
+}
+#q::placeholder {
+ color: #999;
+ opacity: 1;
+ font-style: italic;
+}
+.u {
+ position: relative;
+}
+
+/*** search proposals (.p) and scopes button (.s) with drop-down (.u) ***/
+.c {
+ padding: 6px;
+}
+.r0 {
+ margin: 1em;
+ padding: 6px 0;
+}
+.j, .j li, .j a, .j button {
+ list-style: none outside none;
+ display: block;
+}
+.j {
+ overflow-wrap: anywhere;
+}
+.p a, .p button, .u li {
+ padding: 0.5em 9px;
+ box-sizing: border-box;
+ width: 100%;
+ text-align: left;
+ cursor: pointer;
+}
+.p .w {
+ float: right;
+}
+.p .n {
+ clear: both;
+ margin-top: 3px;
+}
+.p .v {
+ display: inline-block;
+}
+#r .j li a, #b li a, .ba {
+ max-width: 640px;
+ margin: 0 0 0.25em 10px;
+ padding: 6px;
+ border-radius: 4px;
+}
+.j .z a, .j .z button, .j a:focus, .j button:focus, .u .z {
+ background: #e8f2fe;
+ outline: none;
+}
+.j, .j a, #r .t, #b a {
+ color: #222;
+}
+.j a .w, #r .tree .l, #r .t .tl {
+ color: #062;
+}
+#r .l {
+ cursor: pointer;
+}
+.w, .n {
+ font-size: 85%;
+}
+#r .w, #r .n {
+ margin-top: 3px;
+}
+.p, .u {
+ position: absolute;
+ float: left;
+ left: 0;
+ margin-top: -1px;
+ top: 100%;
+ width: 100%;
+ padding: 0;
+ z-index: 3;
+ background: rgba(0, 0, 0, 0);
+}
+.u {
+ margin: -4px 0 0 3px;
+ width: auto;
+}
+.s0 {
+ position: relative;
+ z-index: 5;
+}
+.s {
+ background: #f2f4f7;
+ box-sizing: content-box;
+ display: flex;
+ margin: 3px 6px 3px 3px;
+ padding: 0 0 0 8px;
+ align-items: center;
+ border-radius: 5px;
+ font-size: 1rem;
+ white-space: nowrap;
+}
+.s span {
+ max-width: 240px;
+ overflow: hidden;
+}
+.s, .d, .de {
+ color: #999;
+}
+.qf .s, .qm .s, .s:hover .d, .s:hover .de {
+ color: #222;
+}
+.s .d, .s .de {
+ display: inline-block;
+ transform: rotate(90deg);
+ margin-left: -6px;
+ margin-right: 6px;
+ margin: 0 2px 0 -4px;
+}
+.s .de {
+ margin: 0 6px 0 -6px;
+}
+.p ol, .u ul {
+ display: block;
+ padding: 0;
+ margin: 0;
+ background: #fff;
+ border: 1px solid #37e;
+ border-top: none;
+ border-radius: 0 0 7px 7px;
+ box-shadow: 0 3px 4px rgba(0, 0, 0, 0.2);
+ overflow: hidden;
+}
+.s, .u ul {
+ border: 1px solid #edeff2; /* -2 V of background */
+}
+.u li {
+ white-space: nowrap;
+ padding-left: 36px;
+}
+.u li.x, .u li.y {
+ padding-left: 9px;
+}
+.u li.l {
+ border-top: 1px solid #edeff2;
+}
+.u li.x:before {
+ margin-right: 6px;
+}
+.p .f {
+ display: none;
+ position: absolute;
+ top: 0;
+ left: 100%;
+ margin-left: -1px;
+ height: 100%;
+ min-height: 42em;
+ width: 100%;
+ background: #ffffff;
+ border: 1px solid #999999;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+ z-index: 5;
+}
+.p .z .f {
+ display: block;
+ z-index: 5;
+}
+.count {
+ display: inline-block;
+ background: #eee;
+ border-radius: 2em;
+ color: #666;
+ font-size: 0.8em;
+ font-weight: bold;
+ line-height: 1;
+ margin: 0;
+ min-width: 1em;
+ padding: 3px 7px 4px 7px;
+ position: relative;
+ text-align: center;
+ vertical-align: top;
+}
+#r .tree {
+ margin-bottom: 0.75em;
+}
+.tree input {
+ margin-right: 0.5em;
+}
+
+#h .q0 > .b {
+ margin-left: 6px;
+}
+
+/*** bookmarks (#b) and scopes (#o) ***/
+.g {
+ margin: 0 0 0.5em 10px;
+ font-weight: bold;
+}
+#b .b, #o .b {
+ width: auto;
+ font-size: 1em;
+ font-weight: bold;
+ background: #f2f4f7;
+ border: 1px solid #edeff2;
+ border-radius: 5px;
+ margin: 0.5em -12px 0 18px;
+ color: #999;
+}
+#b .b:hover, #o .b:hover {
+ color: #222;
+}
+#b .br:hover, #o .br:hover {
+ color: #fff;
+ background-color: #c11;
+}
+#b .bc, #o .bc {
+ color: #555;
+ background: none;
+ border: none;
+ margin: 1em 0 2px 2em;
+ float: right;
+}
+#b .bc:hover, #o .bc:hover {
+ background: #d7d9db;
+}
+#b li .b {
+ margin: 0;
+}
+#o li .b {
+ margin: 1px;
+}
+#b input, #o .a input {
+ width: 320px;
+}
+#b .br, #o .br {
+ color: #fff;
+ background: #e33;
+}
+#b li .br, #o li .b {
+ padding: 4px 8px;
+}
+#b .a .b {
+ border: none;
+ border-radius: 0 5px 5px 0;
+}
+#b li, #o li {
+ margin: 0 0 0 18px;
+ list-style: none;
+}
+#b li a, .ba {
+ display: inline-flex;
+ align-items: center;
+ margin: 0;
+ padding: 0 3px;
+}
+#b li a:hover, .ba:hover {
+ background-color: #e8f2fe;
+}
+#b li a span, .ba {
+ padding: 3px;
+}
+.c .a {
+ border: 1px solid #37e;
+ border-radius: 8px;
+ margin: 1em 0 1em 16px;
+ display: inline-flex;
+ min-height: 36px;
+ align-items: center;
+}
+#o div.g {
+ margin: 1em 0 0.5em 10px;
+}
+.c .tree {
+ padding: 0 0 8px 0;
+}
+#b input, #o .a input {
+ margin: 3px 0.5em;
+}
+
+/*** menu ***/
+#a {
+ background: #eef0f3;
+ height: 100%;
+ width: 0;
+ position: fixed;
+ z-index: 9;
+ top: 0;
+ right: 0;
+ overflow-x: hidden;
+ transition: all 0.25s ease-in;
+ border-left: #ddd solid 1px;
+ display: flex;
+ flex-direction: column;
+}
+.e {
+ text-align: right;
+ padding: 6px;
+}
+#a > .b {
+ width: auto;
+ height: auto;
+ font-size: 1em;
+ margin: 3px 6px;
+ color: #222;
+ text-align: left;
+ padding-left: 40px; /* = 8 + 20 + 12 */
+}
+#af {
+ margin: 3px 6px;
+}
+#af span {
+ display: inline-block;
+ padding: 8px 8px 8px 40px;
+}
+#af .b {
+ font-size: 1rem;
+}
+#a > #ap.b, #a > #app.b {
+ padding-left: 8px;
+}
+#a > .b:hover {
+ color: #111;
+}
+#a > #ah {
+ padding-left: 40px;
+}
+#a > #ah.x {
+ padding-left: 6px;
+}
+#ah.x:before, #ap:before, #app:before {
+ display: inline-block;
+ vertical-align: bottom;
+ font-size: 0;
+ width: 20px;
+ height: 20px;
+ margin: 0 12px 0 0;
+}
+#ah.x:before, .u li.x:before {
+ content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' focusable='false' role='presentation'%3E%3Cpath d='M 18.720152,3.3629316 C 18.060084,2.7820531 17.056888,2.8348761 16.47601,3.4949448 L 7.7898314,13.157953 3.4335592,8.9600604 C 2.7999482,8.3528147 1.7966621,8.3791818 1.1894164,9.0128871 0.58217173,9.6465896 0.60853792,10.649785 1.2422432,11.257031 l 5.5443048,5.333102 c 0.2903944,0.290393 0.6864358,0.448864 1.1088434,0.448864 h 0.052827 c 0.4224085,-0.02636 0.8448161,-0.211204 1.1088434,-0.528055 L 18.825715,5.6334442 C 19.432961,4.9470093 19.380137,3.9438138 18.720159,3.3629353 Z' fill='%2354595d'/%3E%3C/svg%3E");
+
+ /* required for IE: */
+ display: inline-block;
+ width: 20px;
+
+}
+#ap:before, #app:before {
+ content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' focusable='false' role='presentation'%3E%3Cpath d='m 6.1536984,14.617279 v 1.536358 h 7.6920456 v -1.536358 z m 0,-2.564015 v 1.536357 h 7.6920456 v -1.536357 z m -4.615227,1.536357 h 1.538409 v 4.10345 c -0.0051,1.246112 0.281016,1.537384 1.538409,1.537384 H 15.384153 c 1.257393,0 1.538409,-0.231787 1.538409,-1.537384 v -4.10345 h 1.538409 c 1.307648,0.02051 1.553281,-0.270247 1.538409,-1.537383 V 6.411404 c 0,-1.2050867 -0.194865,-1.5394343 -1.538409,-1.5394343 H 16.922562 V 2.30898 C 16.937433,1.0423563 16.691801,0.76954505 15.384153,0.76954505 H 4.6152894 c -1.230727,0 -1.543537,0.29332335 -1.538409,1.53943495 v 2.5629897 h -1.538409 c -1.323032,0 -1.538409999868,0.2881953 -1.538409999868,1.5394343 v 5.640834 C -0.0050386,13.298349 0.3077434,13.610134 1.5384714,13.589621 Z M 15.384153,17.692046 H 4.6152894 v -6.66644 H 15.384153 Z m 0.96407,-9.485831 c 0,-0.461523 0.369218,-0.830228 0.830741,-0.830228 0.461522,0 0.830741,0.368705 0.830741,0.830228 0,0.461523 -0.369219,0.830741 -0.830741,0.830741 -0.461523,0 -0.830741,-0.369218 -0.830741,-0.830741 z M 4.6152894,2.3079544 H 15.384153 V 4.8740209 H 4.6152894 Z' fill='%2354595d'/%3E%3C/svg%3E");
+}
+.ht {
+ background: #ff6;
+}
+
+/*** tree ***/
+.tree ul {
+ margin: 0;
+ padding: 0 0 0 8px;
+ line-height: 1.3;
+}
+.tree .closed ul, div#results .closed ul {
+ display: none;
+}
+.tree .l {
+ display: inline-block;
+ padding: 2px 6px;
+ border-radius: 4px;
+ color: #222;
+
+ /* TODO with icons */
+ margin-left: 32px;
+
+ /* TODO without icons */
+ margin-left: 12px;
+
+}
+.tree .l img {
+
+ /* TODO with icons */
+ margin: 0 4px -2px -20px;
+
+ /* TODO without icons */
+ display: none;
+
+}
+.tree li {
+ padding: 0 0 0 10px; /* indent TOC subitems: 10px => .tree a padding-left: 42px - 10px = 32px */
+ list-style: none;
+ position: relative;
+}
+.tree li.xx > .l, .tree li.x > .l {
+ font-weight: bold;
+}
+.tree li.xx > .l {
+ color: #333;
+}
+.tree li.x > .l {
+ color: #444;
+}
+.tree li.xx > .l {
+ background-color: #eef0f3;
+}
+.tree .l, .tree li.xx > .l, .tree li.x > .l, .tree li.xx > .l:hover, .tree li.x > .l:hover {
+ transition: all 0.1s ease;
+}
+.tree li > .l:hover {
+ transition: all 0.1s 0.1s ease;
+ background-color: #f4f9ff;
+}
+.tree li > .l:focus {
+ background-color: #e8f2fe;
+ outline: none;
+}
+.tree .h {
+ /* prevent text selection */
+ user-select: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none; /* otherwise in MS Edge a blinking text cursor will be shown */
+ display: inline-block;
+ position: absolute;
+ left: -2px;
+ cursor: pointer;
+ animation: fly-left 3s ease-in forwards;
+ color: #999;
+ transition: transform .25s, color .25s;
+}
+.tree .open > .h {
+ color: #333;
+ transform: rotate(90deg);
+}
+
+/*** logo ***/
+.k1 /* width: 36..146 */ {
+ /* logo icon */
+}
+.kf /* width: > 146 */ {
+ /* logo full */
+}
+
+/*******************************************************************************
+ * Mobile */
+
+@media screen and (max-width: 768px) {
+
+ #t, #s, .i, .k0, .k1, .kf, .ke0, .ke1, .kef {
+ display: none;
+ }
+ #m {
+ overflow: hidden;
+ }
+ #t.show {
+ display: block;
+ min-width: 100%;
+ }
+ .s span {
+ max-width: 60px;
+ overflow: hidden;
+ }
+
+}
+
+@media screen and (max-height: 360px) {
+ .p ol {
+ overflow-y: auto;
+ max-height: calc(100vh - 38px);
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+ }
+ .p ol::-webkit-scrollbar {
+ display: none;
+ }
+} \ No newline at end of file

Back to the top