|
8 | 8 | $bg-color: #fff;
|
9 | 9 | $text-color: invert($bg-color);
|
10 | 10 |
|
11 |
| - $bg-color-edit-base: #88e; |
12 | 11 | $bg-color-insert-base: #8e8;
|
13 | 12 | $bg-color-delete-base: #e88;
|
14 | 13 |
|
| 14 | + $op-highlight-ratio: 90%; |
| 15 | + $op-normal-ratio: 25%; |
| 16 | + |
15 | 17 | // emphasized colors for detailed inline difference
|
16 |
| - $bg-color-edit-highlight: mix($bg-color-edit-base, $bg-color, 80%); |
17 |
| - $bg-color-insert-highlight: mix($bg-color-insert-base, $bg-color, 80%); |
18 |
| - $bg-color-delete-highlight: mix($bg-color-delete-base, $bg-color, 80%); |
| 18 | + $bg-color-insert-highlight: mix($bg-color-insert-base, $bg-color, $op-highlight-ratio); |
| 19 | + $bg-color-delete-highlight: mix($bg-color-delete-base, $bg-color, $op-highlight-ratio); |
19 | 20 |
|
20 | 21 | // colors for operation rows
|
21 |
| - $bg-color-edit: mix($bg-color-edit-base, $bg-color, 25%); |
22 |
| - $bg-color-insert: mix($bg-color-insert-base, $bg-color, 25%); |
23 |
| - $bg-color-delete: mix($bg-color-delete-base, $bg-color, 25%); |
| 22 | + $bg-color-insert: mix($bg-color-insert-base, $bg-color, $op-normal-ratio); |
| 23 | + $bg-color-delete: mix($bg-color-delete-base, $bg-color, $op-normal-ratio); |
24 | 24 |
|
25 | 25 | $table-head-color: mix($bg-color, $text-color, 65%);
|
26 | 26 | $table-sidebar-color: mix($bg-color, $text-color, 80%);
|
|
130 | 130 | background: $bg-color-delete-highlight;
|
131 | 131 | }
|
132 | 132 | }
|
133 |
| - |
134 |
| - .edit-container { |
135 |
| - &:hover { |
136 |
| - box-shadow: 0 0 8px 2px #888; |
137 |
| - position: relative; |
138 |
| - z-index: 5; |
139 |
| - } |
140 |
| - |
141 |
| - &.edited { |
142 |
| - background: $bg-color-edit; |
143 |
| - } |
144 |
| - } |
145 |
| - |
146 |
| - .edit { |
147 |
| - display: block; |
148 |
| - outline: none; |
149 |
| - } |
150 | 133 | }
|
151 | 134 | }
|
0 commit comments