src/wolnelektury/static/scss/book_text/numbering.scss

   1 @mixin hide-line-numbers {
   2     float: left;
   3     margin-left: -$W_NONUMBERS_TINY;
   4
   5     width: $W_NONUMBERS_TINY;
   6     height: 100%;
   7     padding: 0;
   8     overflow: hidden;
   9
  10     color: white;
  11     text-align: right;
  12
  13     &:hover, &:active {
  14         color: #ccc;
  15         background-color: #CCC;
  16     }
  17
  18     &:before {
  19         content: "#";
  20         display: block;
  21         float: left;
  22         width: $W_NONUMBERS_TINY / 2 - 1px;
  23         height: 100%;
  24         overflow: hidden;
  25         border-right: 1px solid #ccc;
  26     }
  27
  28     @include min-screen($S_NONUMBERS_TINY_MAX) {
  29         width: $W_NONUMBERS;
  30         margin-left: -$W_NONUMBERS;
  31
  32         &:before {
  33             width: $W_NONUMBERS / 2 - 1;
  34         }
  35     }
  36 }
  37
  38
  39 .anchor {
  40     @include hide-line-numbers;
  41
  42     @include min-screen($S_NUMBERS) {
  43         /* Show line numbers. */
  44         font-size: .8em;
  45         margin-left: -$W_NUMBERS;
  46         width: $W_NUMBERS - 4px;
  47         height: auto;
  48         padding: 2px;
  49         text-align: center;
  50         color: #ccc;
  51         user-select: none;
  52         -webkit-user-select: none;
  53         -moz-user-select: none;
  54         -ms-user-select: none;
  55
  56         &:before {
  57             display: none;
  58         }
  59     }
  60 }
  61
  62 @include min-screen($S_NUMBERS) {
  63     .always-hide-line-numbers {
  64         /* Cancel showing line numbers. */
  65         .anchor {
  66             @include hide-line-numbers;
  67         }
  68     }
  69 }