scss hover

1.class {
2    margin:20px;
3    &:hover {
4        color:yellow;
5    }
6}
7

1.button {
2    &:hover {
3      opacity: 1;
4    }
5    &:active {
6      position: relative;
7      top: 7px;
8      box-shadow: none;
9    }
10}
11

1.alert {
2  // The parent selector can be used to add pseudo-classes to the outer
3  // selector.
4  &:hover {
5    font-weight: bold;
6  }
7
8  // It can also be used to style the outer selector in a certain context, such
9  // as a body set to use a right-to-left language.
10  [dir=rtl] & {
11    margin-left: 0;
12    margin-right: 10px;
13  }
14
15  // You can even use it as an argument to pseudo-class selectors.
16  :not(&) {
17    opacity: 0.8;
18  }
19}
20