github.com/shyftnetwork/go-empyrean@v1.8.3-0.20191127201940-fbfca9338f04/shyft_documentation/source/stylesheets/_rtl.scss (about)

     1  ////////////////////////////////////////////////////////////////////////////////
     2  // RTL Styles Variables
     3  ////////////////////////////////////////////////////////////////////////////////
     4  
     5  $default: auto;
     6  
     7  ////////////////////////////////////////////////////////////////////////////////
     8  // TABLE OF CONTENTS
     9  ////////////////////////////////////////////////////////////////////////////////
    10  
    11  #toc>ul>li>a>span {
    12      float: left;
    13  }
    14  
    15  .toc-wrapper {
    16      transition: right 0.3s ease-in-out !important;
    17      left: $default !important;
    18      #{right}: 0;
    19  }
    20  
    21  .toc-h2 {
    22      padding-#{right}: $nav-padding + $nav-indent;
    23  }
    24  
    25  #nav-button {
    26      #{right}: 0;
    27      transition: right 0.3s ease-in-out;
    28      &.open {
    29          right: $nav-width
    30      }
    31  }
    32  
    33  ////////////////////////////////////////////////////////////////////////////////
    34  // PAGE LAYOUT AND CODE SAMPLE BACKGROUND
    35  ////////////////////////////////////////////////////////////////////////////////
    36  .page-wrapper {
    37      margin-#{left}: $default !important;
    38      margin-#{right}: $nav-width;
    39      .dark-box {
    40          #{right}: $default;
    41          #{left}: 0;
    42      }
    43  }
    44  
    45  .lang-selector {
    46      width: $default !important;
    47      a {
    48          float: right;
    49      }
    50  }
    51  
    52  ////////////////////////////////////////////////////////////////////////////////
    53  // CODE SAMPLE STYLES
    54  ////////////////////////////////////////////////////////////////////////////////
    55  .content {
    56      &>h1,
    57      &>h2,
    58      &>h3,
    59      &>h4,
    60      &>h5,
    61      &>h6,
    62      &>p,
    63      &>table,
    64      &>ul,
    65      &>ol,
    66      &>aside,
    67      &>dl {
    68          margin-#{left}: $examples-width;
    69          margin-#{right}: $default !important;
    70      }
    71      &>ul,
    72      &>ol {
    73          padding-#{right}: $main-padding + 15px;
    74      }
    75      table {
    76          th,
    77          td {
    78              text-align: right;
    79          }
    80      }
    81      dd {
    82          margin-#{right}: 15px;
    83      }
    84      aside {
    85          aside:before {
    86              padding-#{left}: 0.5em;
    87          }
    88          .search-highlight {
    89              background: linear-gradient(to top right, #F7E633 0%, #F1D32F 100%);
    90          }
    91      }
    92      pre,
    93      blockquote {
    94          float: left !important;
    95          clear: left !important;
    96      }
    97  }
    98  
    99  ////////////////////////////////////////////////////////////////////////////////
   100  // TYPOGRAPHY
   101  ////////////////////////////////////////////////////////////////////////////////
   102  h1,
   103  h2,
   104  h3,
   105  h4,
   106  h5,
   107  h6,
   108  p,
   109  aside {
   110      text-align: right;
   111      direction: rtl;
   112  }
   113  
   114  .toc-wrapper {
   115      text-align: right;
   116      direction: rtl;
   117      font-weight: 100 !important;
   118  }
   119  
   120  
   121  ////////////////////////////////////////////////////////////////////////////////
   122  // RESPONSIVE DESIGN
   123  ////////////////////////////////////////////////////////////////////////////////
   124  @media (max-width: $tablet-width) {
   125      .toc-wrapper {
   126          #{right}: -$nav-width;
   127          &.open {
   128              #{right}: 0;
   129          }
   130      }
   131      .page-wrapper {
   132          margin-#{right}: 0;
   133      }
   134  }
   135  
   136  @media (max-width: $phone-width) {
   137      %left-col {
   138          margin-#{left}: 0;
   139      }
   140  }