This is the default HTML for Knowledge Base > Home Page. You can use it for reference or copy/paste it in and resave to return to the original default state.
For the default HTML in Settings > Style > Custom HTML > Home Page, see Default Home Page HTML.
<div>[template("base-cats")]</div>
<div class="homepage-widgets">
<div class="col-md-4 col-sm-6">
<h3>Popular Articles</h3>
[template("pop-articles")]</div>
<div class="col-md-4 col-sm-6">
<h3>New Articles</h3>
[template("new-articles")]</div>
<div class="visible-sm clear-both"></div>
<div class="col-md-4 col-sm-6">
<h3>Updated Articles</h3>
[template("up-articles")]</div>
</div>
This is the default HTML for Settings > Style > Custom HTML > Home Page. You can use it for reference or copy/paste it in and resave to return to the original default state.
For the default HTML for Knowledge Base > Home Page, see Default Home Page Article HTML.
<div class="ko-homepage-top">
<h1 class="hg-article-title xcolor">[homepage("title")]</h1>
[template("large-search")]
</div>
<div class="hg-article">
<div class="hg-article-body">
[homepage("body")]
</div>
</div>
This is the default HTML for Settings > Style > Custom HTML > Body. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="row hg-site-body slideout-new">
[template("layout")]
</div>
<div class="row ko-site-footer text-center xsize">
<div>Copyright © 2023 – 2024 Your Company, LLC. All rights reserved.
<br>Made with <a href="https://www.knowledgeowl.com" target="_blank">KnowledgeOwl</a> <img class="ko-logo" src="https://dyzz9obi78pm5.cloudfront.net/app/image/id/65cbb573a7123f123624c722/n/favicon-32px.svg">
</div>
</div>
This is the default HTML for Settings > Style > Custom HTML > Top Navigation. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="navbar-header">
[template("slideout-left-toggle")]
<a class="navbar-brand" href="/[template("rootpath")]" alt="Logo" title="Your site">[template("project-logo")]</a>
<h1 class="hg-project-name">[template("project-name")]</h1>
<div class="nav-left-searchbar hidden-xs">
[template("searchbar")]
</div>
<button type="button" class="navbar-toggle toc-toggle pull-left clear-left" data-toggle="collapse" data-target=".documentation-categories">
<span class="sr-only">Table of Contents</span>
<span class="browse">Table of Contents</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
[template("slideout-right-toggle")]
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse" id="navbar-collapse">
[template("slideout-right-toggle")]
<ul class="nav navbar-nav navbar-right">
<li>[template("searchbar")]</li>
<li>[template("contact")]</li>
<li>[template("login")]</li>
</ul>
</div>
This is the default HTML for Settings > Style > Custom HTML > Article. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="hg-article">
<div class="hg-article-header">
<h1 class="hg-article-title">[article("title")]
<span class="ko-article-actions">
<span class="pdf">[article("pdf_download_tool")]</span>
<a href="#" class="ko-js-print">
<i class="fa fa-print fa-fw"></i>
</a>
<script>
function sendEmail() {
var title = '[article("title")]'.replace("'", "\'").replace("'", "\'");
window.location = 'mailto:?subject=' + title + '&body=' + window.location;
}
</script>
<a href="#" onclick="sendEmail()">
<i class="fa fa-envelope-o fa-fw"></i>
</a>
</span>
</h1>
<div class="metadata">Last Modified on [article("date_modified")]</div>
</div>
<div class="hg-article-body">
[article("body")]
</div>
<div class="hg-article-footer">
<div class="ko-related-articles text-center">
<h3>Related Articles</h3>
[template("related")]
</div>
[template("rating")]
[template("comments")]
</div>
</div>
This is the default HTML for Settings > Style > Custom HTML > Article Version. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="hg-article">
<div class="hg-article-header">
<h1 class="hg-article-title">Default Article Version HTML
</div>
</div>
</div>
This is the default HTML for Settings > Style > Custom HTML > Login Page. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="container login-container">
[template("login-page")]
</div>
This is the default HTML for Settings > Style > Custom HTML > Manage Reader Subscriptions. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="container reader-subscriptions-container">
[template("readersubscriptions-page")]
</div>
This is the default HTML for Settings > Style > Custom HTML > 404 Error Page. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="documentation-article">
<div class="ko-content-cntr">
<div class="hg-article">
<div class="error-page-top text-center">
<h1 class="top-marginless">Uh oh! We’re sorry.</h1>
<h2>We weren't able to find that page.</h2>
<h3>Try a search or let us take you <a href="/help">home</a>.</h3>
[template("large-search")]
</div>
<div class="homepage-widgets">
<div class="col-md-4">
<h3>Popular Articles</h3>
[template("pop-articles")]
</div>
<div class="col-md-4">
<h3>Recently Updated Articles</h3>
[template("up-articles")]
</div>
<div class="col-md-4">
<h3>New Articles</h3>
[template("new-articles")]
</div>
</div>
</div>
</div>
</div>
This is the default HTML for Settings > Style > Custom HTML > Login. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="hg-site-login">
<div class="alert alert-danger text-center">
<h4><i class="fa fa-exclamation-triangle"></i> You do not have access to view this content.</h4>
</div>
</div>
This is the default HTML for Settings > Style > Custom HTML > Right Column. You can use it for reference or copy/paste it in and resave to return to the original default state.
<div class="panel panel-default right-col-panel art-info-panel">
<div class="panel-heading">About this Article</div>
<ul class="list-unstyled stat-list">
<li>Created: [article("date_created")]</li>
<li>Last updated: [article("date_modified")]</li>
<li class="hg-article-controls-right">
<a href="#" class="js-print"><i class="fa fa-print fa-fw"></i></a>
<a href="#">[article("pdf_download_tool")]</a>
<a href="#" onclick="javascript:window.location='mailto:?subject=[article("title")]&body=' + window.location;"><i class="fa fa-envelope-o fa-fw"></i></a>
</li>
</ul>
</div>
<div class="panel panel-default right-col-panel related-panel">
<div class="panel-heading">Related Articles</div>
[template("related")]
</div>
<div class="panel panel-default right-col-panel feedback-panel">
<div class="panel-heading">Was this article helpful? </div>
[template("rating")]
</div>
<div class="panel panel-default right-col-panel pop-panel">
<div class="panel-heading">Most Popular</div>
[template("pop-articles")]
</div>
<div class="panel panel-default right-col-panel new-panel">
<div class="panel-heading">Newest</div>
[template("new-articles")]
</div>
<div class="panel panel-default right-col-panel recent-panel">
<div class="panel-heading">Recently Updated </div>
[template("up-articles")]
</div>
This is the default HTML for Settings > Style > Custom CSS. You can use it for reference or copy/paste it in and resave to return to the original default state.
/******************************************************** General structure ****************************/ /* smooth article resizing on TOC open/close */ .hg-minimalist-theme #ko-article-cntr { transition: all 300ms ease-in-out; width: 100%; } /* hide right col when TOC open */ .hg-minimalist-theme #ko-article-cntr.slideout-panel-left.open+.col-lg-3.visible-lg.right-column { opacity: 0; visibility: hidden; } /* size and position right column if in use */ .hg-minimalist-theme.hg-3column-layout .right-column { top: 65px; padding-right: 35px; z-index: 2; max-width: calc((100vw - 920px) / 2); transition: all 200ms ease-in-out; opacity: 1; } /* make sure footer is full width */ .hg-minimalist-theme.hg-3column-layout .ko-site-footer { width: 100%; } /* self clear page contents */ .documentation-body::after { content: ""; display: table; } /* make site background white */ .hg-minimalist-theme .documentation-body { background: #ffffff; } .hg-site { background: #ffffff; } /******************************************************** Font overrides *************************/ /* color for h1 */ .hg-minimalist-theme .documentation-article h1 { color: #1d284f; } /* article content h2 size */ .documentation-article h2 { font-size: 28px; } /* article content h3 size */ .documentation-article h3 { font-size: 24px; } /* article content h4 size */ .documentation-article h4 { font-size: 18px; } /* default color of a text (links) */ .hg-minimalist-theme a:not(.btn), a:not(.btn) { color: #3C80BA; } /* remove bottom margin from paragraphs in article content */ .documentation-article p { margin-bottom: 0; } /* force default font size for blockquote */ blockquote { font-size: inherit; } /* override default font size for home page search bar */ .hg-minimalist-theme .ko-large-search input.form-control { font-size: 15px; } /******************************************************** Topic Category styles **********************/ /* remove top border, bottom margin from title container */ .hg-minimalist-theme .topics-top-wrapper { border-bottom: none; margin-bottom: 0px; } /* remove border, add padding for topic articles */ .hg-minimalist-theme .topics-articles .hg-article-body, .hg-minimalist-theme .hg-category-page .hg-article-body { border-bottom: none; padding-bottom: 40px; } /* remove padding between topic articles */ .hg-minimalist-theme .topics-articles .hg-article-body { padding-bottom: 0px; } /* topic aricle h2 size */ .documentation-article .topics-articles h2.hg-article-title { font-size: 24px; } /* topic aricle h3 size */ .documentation-article .topics-articles h3 { font-size: 18px; } /* topic aricle h4 size */ .documentation-article .topics-articles h4 { font-size: 16px; } /******************************************************** Default Category Styles *********************/ /* add top and bottom margin to category panels */ .hg-minimalist-theme .category-list { margin-bottom: 40px; margin-top: 40px; } /* remove bottom border from title */ .hg-minimalist-theme .faq-header { border-bottom: none; } /* remove right margin from category description */ .hg-minimalist-theme .faq-top-description { margin-right: 0; } /* change category panels into 2x2 grid */ .hg-minimalist-theme .faq-nav-content .category-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap: 20px; grid-auto-rows: 1fr; } /* get rid of psuedo html elements */ .hg-minimalist-theme .faq-nav-content .category-list .clear-left, .hg-minimalist-theme .faq-nav-content .category-list .clear-both { display: none !important; } /* style category panels */ .hg-minimalist-theme .faq-nav-content .faq-cat-container { margin-left: 0; margin-right: 0; width: auto; border: 1px solid #dcdcdc; border-radius: 4px; transition: all .2s ease-in-out; backface-visibility: hidden; } /* hover effect for category panels */ .hg-minimalist-theme .faq-nav-content .faq-cat-container:hover { background-color: #fff; box-shadow: 2px 4px 4px #aeaeae; transform: scale(1.01) translateZ(0); } /* add bottom margin to list of articles */ .hg-minimalist-theme .faq-nav-content { margin-bottom: 40px; } /* remove right margin from category title */ .hg-minimalist-theme .faq-header { margin-right: 0; } /* hide h2 Articles from default categories */ .hg-minimalist-theme .faq-nav-content h2 { display: none; } /* Force main area to be full width */ .hg-minimalist-theme .hg-category-page .category-list .col-md-6.col-lg-4 { width: 100% !important; } /* adjust position of subscribe button */ .hg-minimalist-theme .ko-cat-sub-cntr { margin-top: 12px; margin-right: 0; } /* apply hover effects to subscribe button */ .hg-minimalist-theme .btn.btn-default.ko-cat-sub { border: 1px solid #b3b3b3; transition: all .1s ease-in-out; backface-visibility: hidden; } .hg-minimalist-theme .btn.btn-default.ko-cat-sub:hover { box-shadow: 1px 2px 2px #aeaeae; transform: scale(1.01) translateZ(0); }
/* subcategory panel display tweaks */ .hg-minimalist-theme .faq-nav-content .faq-cat-panel-container { padding: 0; } .hg-minimalist-theme .faq-nav-content .faq-cat-panel { border: none; box-shadow: none; border-radius: 4px; } /* subcategory content-list display tweaks */ .hg-minimalist-theme .category-list.faq-content-list { margin-bottom: 0; } .hg-minimalist-theme .faq-content-list-container { width: auto; padding: 0; } .hg-minimalist-theme .faq-content-list-container .category-header { border-bottom: none; margin-bottom: 10px; } .hg-minimalist-theme .faq-nav-content .article-block div { margin-left: 0; }/******************************************************** Table of Contents ***********/ /* add border and box-shadow to TOC */ .hg-minimalist-theme.hg-2column-layout .slideout-menu { display: block; padding: 0; box-shadow: none; border: 1px solid #ddd; border-radius: 0 4px 0 0; background-color: #F8F4F1; left: -360px; transition: all 300ms ease-in-out; } /* remove TOC padding */ .hg-minimalist-theme .hg-site-body .documentation-outter-list { padding: 0; } /* style top level content */ .hg-minimalist-theme .documentation-categories li.level-0, .hg-minimalist-theme .documentation-outter-list > .article-container { border-bottom: 0; padding: 0; margin-right: 0; margin-top: 0; margin-bottom: 0; } /* style child content containers */ .hg-minimalist-theme .documentation-categories li { margin-right: 5px; margin-top: 5px; margin-bottom: 5px; } .hg-minimalist-theme .documentation-categories li.level-0 > .category-link-container, .hg-minimalist-theme .documentation-outter-list > .article-container { padding: 5px 10px; } /* style top level articles */ .hg-minimalist-theme .documentation-outter-list > .article-container .article-link { padding: 0 5px; line-height: 33px; } /* background color for active and hovered child content */ .hg-minimalist-theme .documentation-categories li.active, .hg-minimalist-theme .category-link-container.active, .hg-minimalist-theme .documentation-categories .article-container:hover, .hg-minimalist-theme .documentation-categories li a:hover, .hg-minimalist-theme .category-link-container:hover { background-color: #e8e8e8; } /* background color for active and hovered top level content */ .hg-minimalist-theme .level-0 > .category-link-container:hover, .hg-minimalist-theme .level-0 > .category-link-container.active, .hg-minimalist-theme .documentation-outter-list > .article-container:hover, .hg-minimalist-theme .documentation-outter-list > .article-container.active, .hg-minimalist-theme .documentation-outter-list > .article-container .article-link:hover, .hg-minimalist-theme .documentation-outter-list > .article-container .article-link.active { background-color: #f2e9e3; border-radius: 0; } .hg-minimalist-theme .documentation-categories .level-0 > .category-link-container a:hover { background-color: #f2e9e3; } /* override default toc slideout behavior */ .hg-minimalist-theme #ko-article-cntr.slideout-panel.open { transform: translateX(360px); width: calc(100% - 360px); } /* Change TOC chevron-right to plus-square */ .hg-minimalist-theme .documentation-categories .fa-chevron-right:before { content: "\f0fe" !important; } /* Change TOC chevron-down to minus-square */ .hg-minimalist-theme .documentation-categories .fa-chevron-down:before { content: "\f146" !important; } /* make icons slightly larger */ .hg-minimalist-theme .cat-icon, .hg-minimalist-theme .home-icon, .hg-minimalist-theme .alt-icon { padding: 8px 0 0 6px; font-size: 18px; } /* override default box shadow when side TOC is open */ .hg-minimalist-theme .documentation-categories.slideout-menu.open { box-shadow: 2px 4px 4px #aeaeae; left: 0; } /********************************************************* Modals ********************/ /* adjust input border width in modals */ .hg-minimalist-theme .modal .form-control { border-width: 1px; } /********************************************************* PDF Adjustments ***********/ /* hide .pdf-header outside of actual PDFs */ .hg-minimalist-theme .pdf-header { display: none; } /* show .pdf-header in actual PDFs */ .hg-minimalist-theme .hg-pdf .pdf-header { display: block; } /* height of image in .pdf-header */ .hg-minimalist-theme .hg-pdf .pdf-header img { height: 80px; } /******************************************************** Home Page Top and General */ /* get rid of background banner and add some padding to top of home page */ .hg-minimalist-theme .ko-homepage-top { background: none; padding-top: 2em; padding-bottom: 0em; } /* make sure category title is clickable */ .hg-minimalist-theme .hg-home-page .category-header { z-index: 2; } /* change default color for home page title */ .hg-minimalist-theme .ko-homepage-top .hg-article-title { color: #1d284f; } /******************************************************** Content Lists */ /* tweak padding and line heights */ .hg-minimalist-theme .stat-list { line-height: 1.3; font-size: 14px; margin-left: 1px; } .hg-minimalist-theme .stat-list li { padding: 4px 0; } /* remove bottom border from page title */ .hg-minimalist-theme .page-header { border-bottom: none; } /* remove border above "see more..." */ .hg-minimalist-theme .list-action { border-top: none; } /* correct margin and padding for content lists on homepage */ .hg-minimalist-theme .homepage-widgets { margin: 2em -15px; } .hg-minimalist-theme .homepage-widgets .col-md-4.col-sm-6 { padding-left: 15px; } /******************************************************** Search Bar */ /* remove border from individual search bar elements */ .hg-minimalist-theme .hg-search-bar input.form-control, .hg-minimalist-theme .input-group-btn .btn, .hg-minimalist-theme .input-group-btn .btn:hover, .hg-minimalist-theme .hg-search-bar input.form-control:focus, .hg-minimalist-theme .input-group-btn .btn:focus, .hg-minimalist-theme .input-group-btn .btn-default.dropdown-toggle:active, .hg-minimalist-theme .input-group-btn .btn-default.dropdown-toggle:focus { border: none; } /* add border to outer search bar */ .hg-minimalist-theme .hg-search-bar .input-group { border: 1px solid #E6E6E6; border-radius: 4px; transition: border .25s linear,color .25s linear,background-color .25s linear; } /* change border color on focus/active */ .hg-minimalist-theme .hg-search-bar .input-group:active, .hg-minimalist-theme .hg-search-bar .input-group:focus, .hg-minimalist-theme .hg-search-bar .input-group:focus-within { border: 1px solid #f8b88b; } /* remove background color from search button */ .hg-minimalist-theme .input-group-btn .btn { background: none; } /* adjust color and sizing for the refine button */ .hg-minimalist-theme .input-group-btn .btn-default.dropdown-toggle { color: #1d284f; font-size: 16px; border: none; } /* restyle the dropdown caret */ .hg-search-bar .category-dropdown .dropdown-toggle .caret { border: none; display: inline; font-family: 'Font Awesome 6 Pro'; font-weight: 300; font-size: 14px; } .hg-search-bar .category-dropdown .dropdown-toggle .caret::before { content: "\f0d7"; } /* change font color and remove border for search button */ .hg-minimalist-theme span.input-group-btn .btn-default, .hg-minimalist-theme span.input-group-btn .btn-default:hover { color: #E6E6E6; border-left: none; } .hg-minimalist-theme .ko-large-search input.form-control, .hg-minimalist-theme .hg-search-bar input.form-control { border-right: none; } /* add box-shadow to search bar */ .hg-minimalist-theme .input-group { box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.05); } /* remove box shadow from type-ahead suggestion box */ .hg-minimalist-theme .navbar-collapse.in .input-group, .hg-minimalist-theme .navbar-collapse.collapsing .input-group { box-shadow: none; } /* handle styles for showing/hiding type-ahead suggestion box */ .hg-minimalist-theme #navbar-collapse.in, .hg-minimalist-theme #navbar-collapse.collapsing { margin-bottom: 0; padding: 10px; border-radius: 0px 0px 4px 4px; box-shadow: 0px 10px 20px -8px #ccc; } /******************************************************** Search Pages */ /* adjust bottom spacing page titles and containers */ .hg-minimalist-theme .recommended-container h2, .hg-minimalist-theme .hg-contact-form-container h2, .hg-minimalist-theme .hg-article-search { margin-bottom: 40px; } /* add bottom margin to search controls */ .hg-minimalist-theme .ko-srch-meta-cntr { margin-bottom: 20px; } /* add more top margin to full search results */ .hg-minimalist-theme #homepage-search-form .hg-article-search { margin-top: 20px; } /* remove bottom spacing from recommended article titles */ .hg-minimalist-theme .hg-article-search h4 { margin-bottom: 0; } /* increase space between article results */ .hg-minimalist-theme .hg-article-search li { margin-bottom: 25px; } /* adjust size/spacing of article meta data */ .hg-minimalist-theme .hg-article-info { font-size: 12px; margin-bottom: 5px; } /* add spacing after article blurbs */ .hg-minimalist-theme .hg-article-blurb { margin-bottom: 25px; } /* make last modified text for recommended articles smaller */ .hg-minimalist-theme .hg-article-search .hg-date { font-size: 14px; } /* adjust font size and line height for contact form labels */ .hg-minimalist-theme .hg-contact-form-container label { font-size: 18px; line-height: 1.3; } /* decrease width of contact form field borders */ .hg-minimalist-theme .hg-contact-form-container .form-control { border: 1px solid #bdc3c7; } /* update colors for the results paging buttons */ .hg-minimalist-theme .ko-search-pager li.current { background: #1d284f; } .hg-minimalist-theme div.ko-search-pager .pull-left:not(.current) a:not(.btn) { color: #1d284f; } .hg-minimalist-theme div.ko-search-pager .pull-left:not(.current) a:not(.btn):hover { color: #f8b88b; } /******************************************************** Tables ***************************************/ /* adjust table header cell styles */ .table-bordered > thead > tr > th { background-color: #1d284f; color: #ffffff; padding-left: 1em; } /* give left aligned cells some left padding */ .table-bordered>tbody>tr>td, .table-bordered>tfoot>tr>td, table.table-bordered tr td[style*="text-align: left"] { padding-left: 1em; } /******************************************************** Article HTML ***************************************/ /* add some padding to line items */ .hg-article-body ol li { padding: 10px 0; } /* first level - use regular numeric decimals */ .hg-article-body ol { list-style-type: decimal; } /* second level - use lowercase alphabetic */ .hg-article-body ol > li > ol { list-style-type: lower-alpha; } /* third level - use lowercase Roman numerals */ .hg-article-body ol > li > ol > li > ol { list-style-type: lower-roman; } /* optional .article-block styles */ .article-block div { margin-left: 20px; font-size: 15px; line-height: 1.2; } /* default margin for p in lists */ .hg-article-body ul p, .hg-article-body ol p { margin: 20px 0 0; } /* give more top space to article ratings */ .hg-minimalist-theme .hg-ratings { margin-top: 15px; } /* space out the article rating thumbs */ .hg-minimalist-theme .hg-ratings .hg-helpful { margin-right: 20px; } /* styles for check-list bullet points */ ul.check-list { list-style: none; padding-left: 0; } ul.check-list li { position: relative; padding-left: 1.5em; } ul.check-list li:before { font-family: 'FontAwesome'; content: "\f00c" !important; padding-right: 0.5em; font-size: smaller; color: green; } /* remove top border from comment form */ .hg-minimalist-theme #hg-comment-form { border-top: none; } /******************************************************** List pages ************/ /* remove top border from glossary page */ .hg-minimalist-theme .glossary-letter ~ .glossary-letter { border-top: none; } /* left align article lists */ .hg-minimalist-theme .hg-widget-page .ko-content-cntr ol { padding-inline-start: 20px; } /******************************************************** Alert boxes ***********/ /* give alerts, wells, pre some top margin */ .alert, .well, pre { margin-top: 20px; } /* icon styling for all alerts */ .alert::before { display: block; width: 65px; height: 60px; float: left; margin-top: 0px; font-size: 48px; font-weight: 900; font-family: 'Font Awesome 6 Pro'; -moz-osx-font-smoothing: grayscale; font-style: normal; font-variant: normal; line-height: 60px; text-rendering: auto; } /* danger alert styling */ .alert.alert-danger { background: #F4E2E2; border: 1px solid #E6ADA9; } .alert.alert-danger:before { content: "\f071"; color: #f8918b; } /* info alert styling */ .alert.alert-info { background: #F0F7FD; border: 1px solid #69B2F0; } .alert.alert-info:before { content: "\f05a"; color: #97c4ed; } /* success alert styling */ .alert.alert-success { background: #F8FBF9; border: 1px solid #BDDCBC; } .alert.alert-success:before { content: "\f058"; color: #9bdbae; } /* warning alert styling */ .alert.alert-warning { background: #FDF9E6; border: 1px solid #FBD9A4; } .alert.alert-warning:before { content: "\f8fa"; color: #ffcc7a; } /* remove top margin from p tags in alerts */ .alert.alert-info p, .alert.alert-success p, .alert.alert-warning p, .well p { margin-top: 0; } /* make sure there is vertical room icons in alerts */ .alert.alert-info, .alert.alert-success, .alert.alert-danger, .alert.alert-warning { min-height: 90px; } /* Offset lists that are within alert divs */ .alert ul, .alert ol { margin-left: 75px; } /******************************************************************************* Image Captions *****/ /* Set dark background for captions */ .hg-minimalist-theme .documentation-article .fr-img-caption .fr-img-wrap>span { background: #1d284f; } /* Remove border for image captions */ .hg-minimalist-theme .documentation-article span.fr-img-caption { border: none; } /* Fix hyperlinks in image captions, now that we have the dark background */ .hg-minimalist-theme span.fr-inner a { color: #F6A267; text-decoration: none; } /* Image caption hyperlinks should be a different color and underlined on-hover */ .hg-minimalist-theme .fr-inner a:hover { color: #F8B88B; text-decoration: underline; } /********************************************* Back to top snippet styling */ /* basic styles */ .back-to-top { background-color: #fff; margin: 0; position: fixed; bottom: 100px; right: 45px; width: 55px; height: 45px; z-index: 100; text-decoration: none; text-align: center; border-radius: 4px; border: 1px solid #acacac; box-shadow: 1px 3px 3px #aeaeae; visibility: hidden; opacity: 0; transition: all .2s ease-in-out; } /* make visible when scrolled down on page */ .back-to-top.visible { visibility: visible; opacity: 1; } /* icon styles */ .back-to-top i { font-size: 45px; color: #3a3a3a; } /* mouse effect styles */ .back-to-top:hover, .back-to-top:active, .back-to-top:focus { color: #ffffff; } /********************************************* Miscellaneous */ /* optional .margin-top-20 class */ .hg-minimalist-theme .margin-top-20 { margin-top: 20px; } /* panels within the right column */ .hg-minimalist-theme .right-col-panel { border-radius: 4px; } .hg-minimalist-theme .right-col-panel .panel-heading { color: #fff; background: #1d284f; border-radius: 4px 4px 0 0; } /* Add styles for in article TOC snippet to work*/ .hg-minimalist-theme .toc-top { background-color: #f5f5f5; border: 1px solid #e3e3e3; border-radius: 4px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset; margin-bottom: 20px; min-height: 20px; padding: 5px 30px; } /* In article TOC snippet style */ .hg-minimalist-theme .toc-anchor { display: block; height: 140px; margin-top: -140px; visibility: hidden; } /* remove bottom border for articles */ .hg-minimalist-theme .hg-article-body { border-bottom: none; } .ko-content-cntr .pager { margin-top: 40px; } /********************************************************************* 404 page ***********************/ /* remove top border */ .hg-minimalist-theme .error-page-top { border: none; } /********************************************************************* No access page *****************/ /* vertically center h4 */ .hg-site-login .alert h4 { margin-top: 10px; } /* remove duplicate icon */ .hg-site-login .alert h4 i { display: none; } /********************************************************************* Screen size specific adjustments ***************/ /* will apply to screen widths narrower than 1474px */ @media (max-width: 1473px) { /* shrink main content area */ .hg-minimalist-theme.hg-3column-layout:not(.hg-home-page) .ko-content-cntr { max-width: 700px; } /* expand right col size */ .hg-minimalist-theme.hg-3column-layout .right-column { max-width: calc((100vw - 720px) / 2); } } /* will apply to screen widths narrower than 992px */ @media (max-width: 991px) { .hg-minimalist-theme #ko-article-cntr.slideout-panel.open { width: 100%; } } /* will apply to screen widths wider than 575px, not narrower */ @media (min-width: 576px) { .hg-minimalist-theme .hg-home-page .category-list>div { width: 50%; float: left; } .hg-minimalist-theme .category-img { max-width: 50%; } } /* will apply to screen widths wider than 767px */ @media(min-width:768px) { .hg-minimalist-theme .lead, .hg-minimalist-theme .lead p { font-size: 30.01px !important } } /* will apply to screen widths wider than 991px */ @media (min-width: 992px) { .hg-minimalist-theme .hg-home-page .category-list>div { width: 25%; } .hg-minimalist-theme .category-img { max-width: 50%; } }
— Drew E on 07/12/2023
Do you also have the default Custom CSS?