Created
October 1, 2024 16:30
-
-
Save marclave/46fa068e797a22bc9fedc6d4010d3c9e to your computer and use it in GitHub Desktop.
theme for https://windows98.apidocumentation.com/
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
| @font-face { | |
| font-family: 'Pixelated MS Sans Serif'; | |
| font-style: normal; | |
| font-weight: 400; | |
| src: url('https://unpkg.com/[email protected]/dist/ms_sans_serif.woff') format('woff'); | |
| src: url('https://unpkg.com/[email protected]/dist/ms_sans_serif.woff2') format('woff2'); | |
| } | |
| @font-face { | |
| font-family: 'Pixelated MS Sans Serif'; | |
| font-style: normal; | |
| font-weight: 700; | |
| src: url('https://unpkg.com/[email protected]/dist/ms_sans_serif_bold.woff') format('woff'); | |
| src: url('https://unpkg.com/[email protected]/dist/ms_sans_serif_bold.woff2') format('woff2'); | |
| } | |
| :root { | |
| --theme-font: Arial, 'Inter', cursive, var(--system-fonts); | |
| --button-highlight: #ffffff; | |
| --button-face: #dfdfdf; | |
| --button-shadow: #808080; | |
| --window-frame: #0a0a0a; | |
| --border-raised-outer: inset -1px -1px var(--window-frame), | |
| inset 1px 1px var(--button-highlight); | |
| --border-raised-inner: inset -2px -2px var(--button-shadow), | |
| inset 2px 2px var(--button-face); | |
| --border-sunken-outer: inset -1px -1px var(--button-highlight), | |
| inset 1px 1px var(--window-frame); | |
| --border-sunken-inner: inset -2px -2px var(--button-face), | |
| inset 2px 2px var(--button-shadow); | |
| } | |
| .scalar-card *:not(.cm-scroller *), | |
| .sidebar * { | |
| font-family: 'Pixelated MS Sans Serif', cursive, var(--system-fonts); | |
| } | |
| /* basic theme */ | |
| .light-mode, | |
| .dark-mode { | |
| --theme-color-1: #000; | |
| --theme-color-2: #000; | |
| --theme-color-3: #000; | |
| --theme-color-accent: #00f; | |
| --theme-background-1: #c0c0c0; | |
| --theme-background-2: #c0c0c0; | |
| --theme-background-3: #c0c0c0; | |
| --theme-background-accent: #8ab4f81f; | |
| --theme-border-color: grey; | |
| --theme-code-languages-background-supersede: silver; | |
| --theme-code-language-color-supersede: #000; | |
| } | |
| .sidebar-search-key, | |
| .sidebar-search, | |
| .code-languages__active .code-languages-background .code-languages-icon { | |
| border-radius: 0; | |
| box-shadow: | |
| inset -1px -1px #0a0a0a, | |
| inset 1px 1px #fff, | |
| inset -2px -2px grey, | |
| inset 2px 2px #dfdfdf !important; | |
| border: none; | |
| } | |
| .download-cta a, | |
| .light-mode .markdown a, | |
| .dark-mode .markdown a { | |
| text-decoration: underline !important; | |
| } | |
| /* Document header */ | |
| .light-mode .t-doc__header, | |
| .dark-mode .t-doc__header { | |
| --header-background-1: var(--theme-background-1); | |
| --header-border-color: var(--theme-border-color); | |
| --header-color-1: var(--theme-color-1); | |
| --header-color-2: var(--theme-color-2); | |
| --header-background-toggle: var(--theme-color-3); | |
| --header-call-to-action-color: var(--theme-color-accent); | |
| } | |
| /* Document Sidebar */ | |
| .light-mode .t-doc__sidebar, | |
| .dark-mode .t-doc__sidebar { | |
| --sidebar-background-1: white; | |
| --sidebar-item-hover-color: currentColor; | |
| --sidebar-item-hover-background: transparent; | |
| --sidebar-item-active-background: navy; | |
| --sidebar-border-color: var(--theme-border-color); | |
| --sidebar-color-1: var(--theme-color-1); | |
| --sidebar-color-2: var(--theme-color-2); | |
| --sidebar-color-active: white; | |
| --sidebar-search-background: transparent; | |
| --sidebar-search-border-color: var(--theme-border-color); | |
| --sidebar-search--color: var(--theme-color-3); | |
| box-shadow: | |
| inset -1px -1px #fff, | |
| inset 1px 1px grey, | |
| inset -2px -2px #dfdfdf, | |
| inset 2px 2px #0a0a0a; | |
| } | |
| /* advanced */ | |
| .light-mode, | |
| .dark-mode { | |
| --theme-button-1: rgb(49 53 56); | |
| --theme-button-1-color: #fff; | |
| --theme-button-1-hover: rgb(28 31 33); | |
| --theme-color-green: #069061; | |
| --theme-color-red: #ef0006; | |
| --theme-color-yellow: #edbe20; | |
| --theme-color-blue: #0082d0; | |
| --theme-color-orange: #d05e00; | |
| --theme-color-purple: #5203d1; | |
| --theme-scrollbar-color: rgba(0, 0, 0, 0.18); | |
| --theme-scrollbar-color-active: rgba(0, 0, 0, 0.36); | |
| } | |
| :root { | |
| --theme-radius: 0px; | |
| --theme-radius-lg: 0px; | |
| --theme-radius-xl: 0px; | |
| --theme-header-height: 50px; | |
| } | |
| .scalar-card { | |
| box-shadow: | |
| inset -1px -1px #0a0a0a, | |
| inset 1px 1px #fff, | |
| inset -2px -2px grey, | |
| inset 2px 2px #dfdfdf !important; | |
| border: none !important; | |
| --theme-background-1: transparent !important; | |
| --theme-background-2: transparent !important; | |
| --theme-background-3: transparent !important; | |
| } | |
| .badge { | |
| box-shadow: | |
| inset -1px -1px #0a0a0a, | |
| inset 1px 1px #fff, | |
| inset -2px -2px grey, | |
| inset 2px 2px #dfdfdf !important; | |
| border-radius: 0 !important; | |
| margin-right: 6px; | |
| } | |
| .server-item { | |
| box-shadow: | |
| inset -1px -1px #fff, | |
| inset 1px 1px grey, | |
| inset -2px -2px #dfdfdf, | |
| inset 2px 2px #0a0a0a; | |
| background: transparent; | |
| border: none; | |
| } | |
| .card-form-button, | |
| .card-form-input { | |
| box-shadow: | |
| inset -1px -1px #fff, | |
| inset 1px 1px grey, | |
| inset -2px -2px #dfdfdf, | |
| inset 2px 2px #0a0a0a; | |
| background: white; | |
| border: none; | |
| } | |
| .scalar-card:first-of-type:last-of-type .scalar-card-header:before { | |
| content: ''; | |
| position: absolute; | |
| top: 3px; | |
| left: 3px; | |
| width: calc(100% - 7px); | |
| height: 29px; | |
| background: linear-gradient(90deg, navy, #1084d0); | |
| z-index: -1; | |
| } | |
| .scalar-card:first-of-type:last-of-type .scalar-card-header { | |
| --theme-color-3: white !important; | |
| --theme-border-color: transparent; | |
| margin-bottom: -3px; | |
| font-weight: bolder; | |
| } | |
| .darklight { | |
| position: relative; | |
| } | |
| .darklight a { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: linear-gradient(90deg, navy, #1084d0); | |
| color: white; | |
| font-weight: 900; | |
| padding: 16px; | |
| } | |
| .tab { | |
| margin-right: 6px; | |
| text-decoration: none !important; | |
| } | |
| .tab:before { | |
| box-shadow: | |
| inset -1px -1px #0a0a0a, | |
| inset 1px 1px #fff, | |
| inset -2px -2px grey, | |
| inset 2px 2px #dfdfdf !important; | |
| background: silver; | |
| opacity: 1; | |
| border-radius: 3px; | |
| } | |
| .code-languages__active:after { | |
| display: none; | |
| } | |
| .tab-selected:before { | |
| opacity: 1 !important; | |
| } | |
| .custom-scroll .cm-scroller::-webkit-scrollbar:vertical, | |
| .custom-scroll::-webkit-scrollbar:vertical { | |
| width: 16px; | |
| } | |
| .custom-scroll::-webkit-scrollbar:horizontal { | |
| height: 17px; | |
| } | |
| .cm-scroller::-webkit-scrollbar-corner:horizontal, | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-corner:vertical, | |
| .custom-scroll::-webkit-scrollbar-corner:vertical { | |
| background: var(--button-face); | |
| } | |
| .custom-scroll::-webkit-scrollbar-track:horizontal, | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-track:vertical, | |
| .custom-scroll::-webkit-scrollbar-track:vertical { | |
| background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMiIgaGVpZ2h0PSIyIiB2aWV3Qm94PSIwIDAgMiAyIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEgMEgwVjFIMVYySDJWMUgxVjBaIiBmaWxsPSIjQzBDMEMwIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMiAwSDFWMUgwVjJIMVYxSDJWMFoiIGZpbGw9IndoaXRlIi8+Cjwvc3ZnPgo=); | |
| } | |
| .custom-scroll::-webkit-scrollbar-thumb:horizontal, | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-thumb:vertical, | |
| .custom-scroll::-webkit-scrollbar-thumb:vertical { | |
| background-color: var(--button-face); | |
| box-shadow: var(--border-raised-outer), var(--border-raised-inner); | |
| border-radius: 0 !important; | |
| } | |
| .custom-scroll::-webkit-scrollbar-button:horizontal:start:decrement, | |
| .custom-scroll::-webkit-scrollbar-button:horizontal:end:increment, | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-button:vertical:start:decrement, | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-button:vertical:end:increment, | |
| .custom-scroll::-webkit-scrollbar-button:vertical:start:decrement, | |
| .custom-scroll::-webkit-scrollbar-button:vertical:end:increment { | |
| display: block; | |
| } | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-button:vertical:start:increment, | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-button:vertical:end:decrement, | |
| .custom-scroll::-webkit-scrollbar-button:horizontal:start:increment, | |
| .custom-scroll::-webkit-scrollbar-button:horizontal:end:decrement, | |
| .custom-scroll::-webkit-scrollbar-button:vertical:start:increment, | |
| .custom-scroll::-webkit-scrollbar-button:vertical:end:decrement, | |
| .custom-scroll::-webkit-scrollbar-button:horizontal:start:increment, | |
| .custom-scroll::-webkit-scrollbar-button:horizontal:end:decrement { | |
| display: none; | |
| } | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-button:vertical:start, | |
| .custom-scroll::-webkit-scrollbar-button:vertical:start { | |
| height: 17px; | |
| background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNiAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNSAwSDBWMVYxNkgxVjFIMTVWMFoiIGZpbGw9IiNERkRGREYiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yIDFIMVYxNUgyVjJIMTRWMUgyWiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNiAxN0gxNUgwVjE2SDE1VjBIMTZWMTdaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTE1IDFIMTRWMTVIMVYxNkgxNEgxNVYxWiIgZmlsbD0iIzgwODA4MCIvPgo8cmVjdCB4PSIyIiB5PSIyIiB3aWR0aD0iMTIiIGhlaWdodD0iMTMiIGZpbGw9IiNDMEMwQzAiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik04IDZIN1Y3SDZWOEg1VjlINFYxMEgxMVY5SDEwVjhIOVY3SDhWNloiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=); | |
| } | |
| .custom-scroll .cm-scroller::-webkit-scrollbar-button:vertical:end, | |
| .custom-scroll::-webkit-scrollbar-button:vertical:end { | |
| height: 17px; | |
| background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNiAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNSAwSDBWMVYxNkgxVjFIMTVWMFoiIGZpbGw9IiNERkRGREYiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yIDFIMVYxNUgyVjJIMTRWMUgyWiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNiAxN0gxNUgwVjE2SDE1VjBIMTZWMTdaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTE1IDFIMTRWMTVIMVYxNkgxNEgxNVYxWiIgZmlsbD0iIzgwODA4MCIvPgo8cmVjdCB4PSIyIiB5PSIyIiB3aWR0aD0iMTIiIGhlaWdodD0iMTMiIGZpbGw9IiNDMEMwQzAiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMSA2SDRWN0g1VjhINlY5SDdWMTBIOFY5SDlWOEgxMFY3SDExVjZaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K); | |
| } | |
| .custom-scroll::-webkit-scrollbar-button:horizontal:start { | |
| width: 16px; | |
| background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNiAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNSAwSDBWMVYxNkgxVjFIMTVWMFoiIGZpbGw9IiNERkRGREYiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yIDFIMVYxNUgyVjJIMTRWMUgyWiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNiAxN0gxNUgwVjE2SDE1VjBIMTZWMTdaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTE1IDFIMTRWMTVIMVYxNkgxNEgxNVYxWiIgZmlsbD0iIzgwODA4MCIvPgo8cmVjdCB4PSIyIiB5PSIyIiB3aWR0aD0iMTIiIGhlaWdodD0iMTMiIGZpbGw9IiNDMEMwQzAiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05IDRIOFY1SDdWNkg2VjdINVY4SDZWOUg3VjEwSDhWMTFIOVY0WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==); | |
| } | |
| .custom-scroll::-webkit-scrollbar-button:horizontal:end { | |
| width: 16px; | |
| background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNiAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNSAwSDBWMVYxNkgxVjFIMTVWMFoiIGZpbGw9IiNERkRGREYiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yIDFIMVYxNUgyVjJIMTRWMUgyWiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNiAxN0gxNUgwVjE2SDE1VjBIMTZWMTdaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTE1IDFIMTRWMTVIMVYxNkgxNEgxNVYxWiIgZmlsbD0iIzgwODA4MCIvPgo8cmVjdCB4PSIyIiB5PSIyIiB3aWR0aD0iMTIiIGhlaWdodD0iMTMiIGZpbGw9IiNDMEMwQzAiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03IDRINlYxMUg3VjEwSDhWOUg5VjhIMTBWN0g5VjZIOFY1SDdWNFoiIGZpbGw9ImJsYWNrIi8+Cjwvc3ZnPgo=); | |
| } | |
| .scalar-api-client__codemirror__wrapper { | |
| background: white; | |
| padding-top: 0px; | |
| } | |
| .show-more, | |
| .scalar-api-client__history-toggle, | |
| .scalar-api-client__send-request-button:before, | |
| .parameter-schema .properties, | |
| .show-api-client-button:before, | |
| .properties .properties { | |
| background: silver !important; | |
| border-radius: 0px !important; | |
| border: none !important; | |
| opacity: 1; | |
| box-shadow: | |
| inset -1px -1px #0a0a0a, | |
| inset 1px 1px #fff, | |
| inset -2px -2px grey, | |
| inset 2px 2px #dfdfdf !important; | |
| } | |
| .show-more:active, | |
| .scalar-api-client__history-toggle:active, | |
| .scalar-api-client__send-request-button:active:before, | |
| .parameter-schema .properties:active, | |
| .show-api-client-button:active:before, | |
| .properties .properties:active { | |
| box-shadow: inset -1px -1px #fff, inset 1px 1px #0a0a0a, inset -2px -2px #dfdfdf, inset 2px 2px grey !important; | |
| } | |
| .scalar-api-client .scalar-api-client__send-request-button { | |
| margin-left: 12px; | |
| } | |
| .scalar-api-client .scalar-api-client__send-request-button:before { | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| } | |
| .scalar-api-client__send-request-button, | |
| .show-api-client-button span, | |
| .show-api-client-button svg { | |
| color: var(--theme-color-1) !important; | |
| } | |
| .sidebar-heading-type { | |
| box-shadow: | |
| inset -1px -1px #0a0a0a, | |
| inset 1px 1px #fff, | |
| inset -2px -2px grey, | |
| inset 2px 2px #dfdfdf !important; | |
| border-radius: 0px !important; | |
| } | |
| .item-entry--active { | |
| box-shadow: | |
| inset -1px -1px #0a0a0a, | |
| inset 1px 1px #fff, | |
| inset -2px -2px grey, | |
| inset 2px 2px #dfdfdf !important; | |
| border-radius: 0px !important; | |
| background: white; | |
| } | |
| .table-row:first-of-type > div { | |
| box-shadow: | |
| inset -1px -1px #0a0a0a, | |
| inset 1px 1px #fff, | |
| inset -2px -2px grey, | |
| inset 2px 2px #dfdfdf; | |
| } | |
| .scalar-api-client__item { | |
| --theme-background-2: #dfdfdf; | |
| } | |
| .scalar-api-client__codemirror { | |
| box-shadow: | |
| inset -1px -1px #fff, | |
| inset 1px 1px grey, | |
| inset -2px -2px #dfdfdf, | |
| inset 2px 2px #0a0a0a; | |
| } | |
| .t-doc__header .header-item-logo { | |
| height: 32px; | |
| } | |
| .toast-layout { | |
| box-shadow: inset -1px -1px #0a0a0a, inset 1px 1px #fff, inset -2px -2px grey, inset 2px 2px #dfdfdf !important; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment