diff --git a/layouts/partials/shortcodes/swagger.html b/layouts/partials/shortcodes/swagger.html index a8ab9fc06c0..bb3140daabb 100644 --- a/layouts/partials/shortcodes/swagger.html +++ b/layouts/partials/shortcodes/swagger.html @@ -11,15 +11,16 @@ allow-spec-file-download="false" allow-server-selection="false" allow-try="false" + font-size="default" render-style="read" {{- else }} allow-spec-file-download="true" allow-server-selection="true" allow-try="true" + font-size="largest" render-style="view" {{- end }} default-schema-tab="example" - font-size="largest" layout="column" load-fonts="false" schema-description-expanded="true" diff --git a/static/css/format-print.css b/static/css/format-print.css index c9ebb1918dd..a2a29843ab4 100644 --- a/static/css/format-print.css +++ b/static/css/format-print.css @@ -154,18 +154,57 @@ div.box { div.box > .box-content { background-color: white; } + rapi-doc{ - /* adjust rapi-doc internals to fill out available space */ + /* adjust rapi-doc internals to fill out available space with render-style=read */ margin-left: calc( -80px ); width: calc( 100% + 80px + 80px ); } - +@media (max-width: 1023px) { + rapi-doc { + margin-left: calc( -8px ); + width: calc( 100% + 8px + 8px ); + } +} rapi-doc::part(section-tag) { + /* adjust rapi-doc internals to fill out available space with render-style=read */ margin-left: 80px; margin-right: 80px; padding-left: 0; padding-right: 0; } +@media (max-width: 1023px) { + rapi-doc::part(section-tag) { + margin-left: 8px; + margin-right: 8px; + padding-left: 0; + padding-right: 0; + } +} + +rapi-doc::part(section-main-content) { + /* override variables for adapting rapidoc design to print theme */ + --font-size-regular: 8.9pt; + --fg: black; + --fg2: black; + --fg3: black; +} + +rapi-doc::part(section-overview-title) { + /* set print color for titles */ + color: black !important; +} + +rapi-doc::part(operation-divider) { + /* remove whitespace */ + margin-bottom: 1rem; + margin-top: 1rem; +} + +rapi-doc::part(section-navbar) { + /* removes the nav bar for render-style=read */ + display: none; +} .btn, #body .tab-nav-button { diff --git a/static/css/theme-neon.css b/static/css/theme-neon.css index 598e9122be6..66cdb471644 100644 --- a/static/css/theme-neon.css +++ b/static/css/theme-neon.css @@ -106,6 +106,19 @@ body h2 { 0 0 10px var(--INTERNAL-MAIN-TITLES-H2-color); } +@media screen { + body:not(.print) rapi-doc::part(section-overview-title) { + color: #fff; + text-shadow: + 0 0 1px #fff, + 0 0 2px #fff, + 0 0 8px #808080, + 0 0 4px var(--INTERNAL-MAIN-TITLES-H2-color), + 0 0 8px var(--INTERNAL-MAIN-TITLES-H2-color), + 0 0 10px var(--INTERNAL-MAIN-TITLES-H2-color); + } +} + body h3, body .article-subheading { color: #fff; text-shadow: diff --git a/static/css/theme.css b/static/css/theme.css index dde9590786a..a9d5171e1ac 100644 --- a/static/css/theme.css +++ b/static/css/theme.css @@ -1266,23 +1266,42 @@ h6 a { } rapi-doc { - /* adjust rapi-doc internals to fill out available space */ + /* adjust rapi-doc internals to fill out available space with render-style=view */ margin-left: calc( -8px - 24px ); width: calc( 100% + 8px + 24px + 8px ); } +@media (max-width: 767px) { + rapi-doc { + margin-left: calc( -12px ); + width: calc( 100% + 12px + 4px ); + } +} -rapi-doc::part(section-navbar) { - display: none; +rapi-doc::part(section-main-content) { + /* override variables for adapting rapidoc design to theme */ + --font-mono: var(--INTERNAL-CODE-font); + --font-size-mono: 15px; + --font-regular: var(--INTERNAL-MAIN-font); + --font-size-regular: 16.25px; + font-weight: 300 !important; } -rapi-doc::part(section-endpoint-head-method) { - font-size: 11px; +rapi-doc::part(section-overview-title) { + color: var(--INTERNAL-MAIN-TITLES-H2-color); + font-size: 2.55rem; + font-weight: 500; } rapi-doc::part(btn) { + /* makes download button large enough to not overflow default text */ width: unset !important; } +rapi-doc::part(section-endpoint-head-method) { + /* makes method marker large enough to not overflow on text DELETE */ + font-size: 11px; +} + .select-container i { padding-top: .25em; }