iframe-proxy | Sunbelt Computer Software

187 lines (155 loc) · 3.41 KB

/* Grid-based layout
------------------------------------------------------------------------------*/
.article-grid-container {
  max-width: 720px;
  @include breakpoint(xl) {
    max-width: none;
    display: grid;
    grid-template-rows: auto 1fr;
    grid-template-columns: minmax(500px, 720px) minmax(220px, 1fr);
    grid-template-areas:
    'top right-sidebar'
    'bottom right-sidebar';
    column-gap: $spacer-6;
  @include breakpoint(xl) {
    column-gap: $spacer-9;
.article-grid-toc {
  grid-area: right-sidebar;
.article-grid-toc-content {
  @include breakpoint(xl) {
    position: sticky;
    top: $spacer-4;
    max-height: calc(100vh - #{$spacer-4});
    overflow-y: auto;
    padding-bottom: $spacer-4;
.article-grid-head {
  grid-area: top;
.article-grid-body {
  grid-area: bottom;
/* Deprecation banner
------------------------------------------------------------------------------*/
.deprecation-banner {
  & + .alert {
    margin-top: 5px;
  & > *:first-child {
    margin-top: 0;
  & > *:last-child {
    margin-bottom: 0;
  + #bootcamp {
    margin-top: 20px;
    font-weight: bold;
   margin: 0;
/* Code style overrides
------------------------------------------------------------------------------*/
.markdown-body .highlight pre, .markdown-body pre {
  margin-top: 10px;
.height-constrained-code-block pre {
  max-height: 500px;
  overflow: auto;
/* Breadcrumbs
------------------------------------------------------------------------------*/
.breadcrumbs-wrapper {
  @include breakpoint(xl) {
    height: 39px;
.breadcrumbs a:not(:last-child)::after, .breadcrumbs span:not(:last-child)::after {
  content: '/';
  color: var(--color-auto-gray-4);
  padding-right: $spacer-1;
  padding-left: $spacer-2;
  display:inline-block;
/* Numbered procedures (step 1, step 2, ...)
------------------------------------------------------------------------------*/
.markdown-body ol {
  counter-reset: li;
  list-style: none;
  position: relative;
  padding-bottom: 10px;
  padding-left: 0;
.markdown-body ol > li {
  padding: 15px 0 15px 55px;
  position: relative;
  margin-bottom: 5px;
  border-top: 3px solid var(--color-auto-gray-2);
.markdown-body ol > li:before {
  content: counter(li);
  counter-increment: li;
  position: absolute;
  top: 10px;
  height: 100%;
  width: 30px;
  padding: 0 10px 0 0;
  color: var(--color-auto-gray-4);
  font-size: 22px;
  font-weight: bold;
  line-height: 35px;
  text-align: right;
.markdown-body ol > li > p {
  margin: 0;
.markdown-body ol > li > p:first-child {
  margin-top: 0;
.markdown-body ol > li:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
.procedural-image-wrapper {
  display: block;
  padding: 10px 0;
  margin: 20px auto 0 auto;
.procedural-image-wrapper img {
  border-radius: 5px;
  border: 2px solid var(--color-auto-gray-2);
  width: auto;
  height: auto;
  max-height: 500px;
// make sure images that contain emoji render at the expected size
img[src*="https://github.githubassets.com/images/icons/emoji"] {
  height: 20;
  width: 20;
  align: absmiddle;
/* Notes, tips, warning, and danger styles
------------------------------------------------------------------------------*/
  // remove extra space under lists inside of notes
    margin-bottom: 0;

Sunbelt Computer Software

PL/B Language Development and Support

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Sunbelt Computer Software

PL/B Language Development and Support

Uh oh!

FilesExpand file tree

article.scss

Latest commit

History

article.scss

File metadata and controls