"Fossies" - the Fresh Open Source Software Archive

Member "reveal.js-4.1.2/css/theme/template/theme.scss" (9 Jun 2021, 5827 Bytes) of package /linux/www/reveal.js-4.1.2.tar.gz:


As a special service "Fossies" has tried to format the requested source page into HTML format using (guessed) SASS/SCSS source code syntax highlighting (style: standard) with prefixed line numbers. Alternatively you can here view or download the uninterpreted source code file. See also the latest Fossies "Diffs" side-by-side code changes report for "theme.scss": 4.1.1_vs_4.1.2.

    1 // Base theme template for reveal.js
    2 
    3 /*********************************************
    4  * GLOBAL STYLES
    5  *********************************************/
    6 
    7 @import "./exposer";
    8 
    9 .reveal-viewport {
   10     @include bodyBackground();
   11     background-color: var(--r-background-color);
   12 }
   13 
   14 .reveal {
   15     font-family: var(--r-main-font);
   16     font-size: var(--r-main-font-size);
   17     font-weight: normal;
   18     color: var(--r-main-color);
   19 }
   20 
   21 .reveal ::selection {
   22     color: var(--r-selection-color);
   23     background: var(--r-selection-background-color);
   24     text-shadow: none;
   25 }
   26 
   27 .reveal ::-moz-selection {
   28     color: var(--r-selection-color);
   29     background: var(--r-selection-background-color);
   30     text-shadow: none;
   31 }
   32 
   33 .reveal .slides section,
   34 .reveal .slides section>section {
   35     line-height: 1.3;
   36     font-weight: inherit;
   37 }
   38 
   39 /*********************************************
   40  * HEADERS
   41  *********************************************/
   42 
   43 .reveal h1,
   44 .reveal h2,
   45 .reveal h3,
   46 .reveal h4,
   47 .reveal h5,
   48 .reveal h6 {
   49     margin: var(--r-heading-margin);
   50     color: var(--r-heading-color);
   51 
   52     font-family: var(--r-heading-font);
   53     font-weight: var(--r-heading-font-weight);
   54     line-height: var(--r-heading-line-height);
   55     letter-spacing: var(--r-heading-letter-spacing);
   56 
   57     text-transform: var(--r-heading-text-transform);
   58     text-shadow: var(--r-heading-text-shadow);
   59 
   60     word-wrap: break-word;
   61 }
   62 
   63 .reveal h1 {font-size: var(--r-heading1-size); }
   64 .reveal h2 {font-size: var(--r-heading2-size); }
   65 .reveal h3 {font-size: var(--r-heading3-size); }
   66 .reveal h4 {font-size: var(--r-heading4-size); }
   67 
   68 .reveal h1 {
   69     text-shadow: var(--r-heading1-text-shadow);
   70 }
   71 
   72 
   73 /*********************************************
   74  * OTHER
   75  *********************************************/
   76 
   77 .reveal p {
   78     margin: var(--r-block-margin) 0;
   79     line-height: 1.3;
   80 }
   81 
   82 /* Remove trailing margins after titles */
   83 .reveal h1:last-child,
   84 .reveal h2:last-child,
   85 .reveal h3:last-child,
   86 .reveal h4:last-child,
   87 .reveal h5:last-child,
   88 .reveal h6:last-child {
   89     margin-bottom: 0;
   90 }
   91 
   92 /* Ensure certain elements are never larger than the slide itself */
   93 .reveal img,
   94 .reveal video,
   95 .reveal iframe {
   96     max-width: 95%;
   97     max-height: 95%;
   98 }
   99 .reveal strong,
  100 .reveal b {
  101     font-weight: bold;
  102 }
  103 
  104 .reveal em {
  105     font-style: italic;
  106 }
  107 
  108 .reveal ol,
  109 .reveal dl,
  110 .reveal ul {
  111     display: inline-block;
  112 
  113     text-align: left;
  114     margin: 0 0 0 1em;
  115 }
  116 
  117 .reveal ol {
  118     list-style-type: decimal;
  119 }
  120 
  121 .reveal ul {
  122     list-style-type: disc;
  123 }
  124 
  125 .reveal ul ul {
  126     list-style-type: square;
  127 }
  128 
  129 .reveal ul ul ul {
  130     list-style-type: circle;
  131 }
  132 
  133 .reveal ul ul,
  134 .reveal ul ol,
  135 .reveal ol ol,
  136 .reveal ol ul {
  137     display: block;
  138     margin-left: 40px;
  139 }
  140 
  141 .reveal dt {
  142     font-weight: bold;
  143 }
  144 
  145 .reveal dd {
  146     margin-left: 40px;
  147 }
  148 
  149 .reveal blockquote {
  150     display: block;
  151     position: relative;
  152     width: 70%;
  153     margin: var(--r-block-margin) auto;
  154     padding: 5px;
  155 
  156     font-style: italic;
  157     background: rgba(255, 255, 255, 0.05);
  158     box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
  159 }
  160     .reveal blockquote p:first-child,
  161     .reveal blockquote p:last-child {
  162         display: inline-block;
  163     }
  164 
  165 .reveal q {
  166     font-style: italic;
  167 }
  168 
  169 .reveal pre {
  170     display: block;
  171     position: relative;
  172     width: 90%;
  173     margin: var(--r-block-margin) auto;
  174 
  175     text-align: left;
  176     font-size: 0.55em;
  177     font-family: var(--r-code-font);
  178     line-height: 1.2em;
  179 
  180     word-wrap: break-word;
  181 
  182     box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15);
  183 }
  184 
  185 .reveal code {
  186     font-family: var(--r-code-font);
  187     text-transform: none;
  188     tab-size: 2;
  189 }
  190 
  191 .reveal pre code {
  192     display: block;
  193     padding: 5px;
  194     overflow: auto;
  195     max-height: 400px;
  196     word-wrap: normal;
  197 }
  198 
  199 .reveal .code-wrapper {
  200     white-space: normal;
  201 }
  202 
  203 .reveal .code-wrapper code {
  204     white-space: pre;
  205 }
  206 
  207 .reveal table {
  208     margin: auto;
  209     border-collapse: collapse;
  210     border-spacing: 0;
  211 }
  212 
  213 .reveal table th {
  214     font-weight: bold;
  215 }
  216 
  217 .reveal table th,
  218 .reveal table td {
  219     text-align: left;
  220     padding: 0.2em 0.5em 0.2em 0.5em;
  221     border-bottom: 1px solid;
  222 }
  223 
  224 .reveal table th[align="center"],
  225 .reveal table td[align="center"] {
  226     text-align: center;
  227 }
  228 
  229 .reveal table th[align="right"],
  230 .reveal table td[align="right"] {
  231     text-align: right;
  232 }
  233 
  234 .reveal table tbody tr:last-child th,
  235 .reveal table tbody tr:last-child td {
  236     border-bottom: none;
  237 }
  238 
  239 .reveal sup {
  240     vertical-align: super;
  241     font-size: smaller;
  242 }
  243 .reveal sub {
  244     vertical-align: sub;
  245     font-size: smaller;
  246 }
  247 
  248 .reveal small {
  249     display: inline-block;
  250     font-size: 0.6em;
  251     line-height: 1.2em;
  252     vertical-align: top;
  253 }
  254 
  255 .reveal small * {
  256     vertical-align: top;
  257 }
  258 
  259 .reveal img {
  260     margin: var(--r-block-margin) 0;
  261 }
  262 
  263 
  264 /*********************************************
  265  * LINKS
  266  *********************************************/
  267 
  268 .reveal a {
  269     color: var(--r-link-color);
  270     text-decoration: none;
  271     transition: color .15s ease;
  272 }
  273     .reveal a:hover {
  274         color: var(--r-link-color-hover);
  275         text-shadow: none;
  276         border: none;
  277     }
  278 
  279 .reveal .roll span:after {
  280     color: #fff;
  281     // background: darken( var(--r-link-color), 15% );
  282      background: var(--r-link-color-dark);
  283 
  284 }
  285 
  286 
  287 /*********************************************
  288  * Frame helper
  289  *********************************************/
  290 
  291 .reveal .r-frame {
  292     border: 4px solid var(--r-main-color);
  293     box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  294 }
  295 
  296 .reveal a .r-frame {
  297     transition: all .15s linear;
  298 }
  299 
  300 .reveal a:hover .r-frame {
  301     border-color: var(--r-link-color);
  302     box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
  303 }
  304 
  305 
  306 /*********************************************
  307  * NAVIGATION CONTROLS
  308  *********************************************/
  309 
  310 .reveal .controls {
  311     color: var(--r-link-color);
  312 }
  313 
  314 
  315 /*********************************************
  316  * PROGRESS BAR
  317  *********************************************/
  318 
  319 .reveal .progress {
  320     background: rgba(0,0,0,0.2);
  321     color: var(--r-link-color);
  322 }
  323 
  324 /*********************************************
  325  * PRINT BACKGROUND
  326  *********************************************/
  327  @media print {
  328     .backgrounds {
  329         background-color: var(--r-background-color);
  330     }
  331 }