move devtools to separate directory, make HTML-based inspector work

[themes.git] / LCARStrek / devtools / fonts.css

diff --git a/LCARStrek/devtools/fonts.css b/LCARStrek/devtools/fonts.css
new file mode 100644 (file)
index 0000000..7d469d4
--- /dev/null
+++ b/LCARStrek/devtools/fonts.css
@@ -0,0 +1,130 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+#sidebar-panel-fontinspector {
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  padding-bottom: 20px;
+  width: 100%;
+  /* Bug 1243598 - Reduce the container height by the tab height to make room
+     for the tabs above. */
+  height: calc(100% - 24px);
+  position: absolute;
+}
+
+#sidebar-panel-fontinspector > .devtools-toolbar {
+  display: flex;
+}
+
+#font-container {
+  overflow: auto;
+  flex: auto;
+}
+
+#all-fonts {
+  padding: 0;
+  margin: 0;
+}
+
+#showall,
+#font-showall {
+  border-radius: 300px;
+  border: none;
+  background-color: var(--in-content-button-background);
+  color: var(--in-content-selected-text);
+  margin: 3px;
+  cursor: pointer;
+  position: fixed;
+  bottom: 0;
+  right: 0;
+}
+
+.dim > #font-container,
+.font:not(.has-code) .font-css-code,
+.font-is-local,
+.font-is-remote,
+.font.is-local .font-format-url,
+#font-template {
+  display: none;
+}
+
+.font.is-remote .font-is-remote,
+.font.is-local .font-is-local {
+  display: inline;
+}
+
+.font-format::before {
+  content: "(";
+}
+
+.font-format::after {
+  content: ")";
+}
+
+.preview-input-toolbar {
+  display: flex;
+  width: 100%;
+}
+
+.font-preview-container {
+  overflow-x: auto;
+}
+
+#preview-text-input,
+#font-preview-text-input {
+  font: inherit;
+  margin-top: 1px;
+  margin-bottom: 1px;
+  padding-top: 0;
+  padding-bottom: 0;
+  flex: 1;
+}
+
+.font {
+  padding: 10px 10px;
+}
+
+.theme-dark .font,
+.theme-light .font {
+  border-bottom: 1px solid #A09090;
+}
+
+.font:last-of-type {
+  border-bottom: 0;
+}
+
+.font:nth-child(even) {
+  background: var(--theme-contrast-background);
+}
+
+.font-preview {
+  margin-left: -4px;
+  height: 60px;
+  display: block;
+}
+
+.font-info {
+  display: block;
+}
+
+.font-name {
+  display: inline;
+}
+
+.font-css-code {
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  padding: 5px;
+}
+
+.theme-light .font-css-code,
+.theme-light .font-url ,
+.theme-dark .font-css-code,
+.theme-dark .font-url {
+  border: 1px solid #A09090;
+  background: #000000;
+  color: #336699;
+}