init

liuxiaolong

2019-05-06 2ab7a76a38fbf8fa107bf6371f5410ba54e1d394

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
@mixin quill-generate-lists($indent) {
  $quill-list-types: (
    1: lower-alpha,
    2: lower-roman,
    3: decimal,
    4: lower-alpha,
    5: lower-roman,
    6: decimal,
    7: lower-alpha,
    8: lower-roman,
    9: decimal
  );
 
  @for $i from 1 through 9 {
    ol li.ql-indent-#{$i} {
      counter-increment: list-#{$i};
 
      @if $i < 9 {
        $lists: '';
 
        @for $l from $i + 1 through 9 {
          $lists: "#{$lists} list-#{$l}";
        }
 
        counter-reset: #{$lists};
      }
 
      &::before {
        content: counter(list-#{$i}, map-get($quill-list-types, $i)) '. ';
      }
    }
 
    .ql-indent-#{$i}:not(.ql-direction-rtl) {
      padding-left: $indent * $i;
 
      [dir=rtl] & {
        padding-right: $indent * $i;
        padding-left: 0;
      }
    }
    li.ql-indent-#{$i}:not(.ql-direction-rtl) {
      padding-left: $indent * ($i + 1);
 
      [dir=rtl] & {
        padding-right: $indent * ($i + 1);
        padding-left: 0;
      }
    }
    .ql-indent-#{$i}.ql-direction-rtl.ql-align-right {
      padding-right: $indent * $i;
 
      [dir=rtl] & {
        padding-right: 0;
        padding-left: $indent * $i;
      }
    }
    li.ql-indent-#{$i}.ql-direction-rtl.ql-align-right {
      padding-right: $indent * ($i + 1);
 
      [dir=rtl] & {
        padding-right: 0;
        padding-left: $indent * ($i + 1);
      }
    }
  }
}
 
@mixin quill-theme($color) {
  .ql-snow.ql-toolbar,
  .ql-snow .ql-toolbar {
    button:hover,
    button:focus,
    button.ql-active,
    .ql-picker-label:hover,
    .ql-picker-label.ql-active,
    .ql-picker-item:hover,
    .ql-picker-item.ql-selected {
      color: $color !important;
    }
 
    button:hover .ql-fill,
    button:focus .ql-fill,
    button.ql-active .ql-fill,
    .ql-picker-label:hover .ql-fill,
    .ql-picker-label.ql-active .ql-fill,
    .ql-picker-item:hover .ql-fill,
    .ql-picker-item.ql-selected .ql-fill,
    button:hover .ql-stroke.ql-fill,
    button:focus .ql-stroke.ql-fill,
    button.ql-active .ql-stroke.ql-fill,
    .ql-picker-label:hover .ql-stroke.ql-fill,
    .ql-picker-label.ql-active .ql-stroke.ql-fill,
    .ql-picker-item:hover .ql-stroke.ql-fill,
    .ql-picker-item.ql-selected .ql-stroke.ql-fill {
      fill: $color !important;
    }
 
    button:hover .ql-stroke,
    button:focus .ql-stroke,
    button.ql-active .ql-stroke,
    .ql-picker-label:hover .ql-stroke,
    .ql-picker-label.ql-active .ql-stroke,
    .ql-picker-item:hover .ql-stroke,
    .ql-picker-item.ql-selected .ql-stroke,
    button:hover .ql-stroke-miter,
    button:focus .ql-stroke-miter,
    button.ql-active .ql-stroke-miter,
    .ql-picker-label:hover .ql-stroke-miter,
    .ql-picker-label.ql-active .ql-stroke-miter,
    .ql-picker-item:hover .ql-stroke-miter,
    .ql-picker-item.ql-selected .ql-stroke-miter {
      stroke: $color !important;
    }
  }
}