src/styles/service-table.scss


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

@import './config.scss';

.theme__dark .service-table {
  .service-table__icon.has-custom-icon {
    border: 1px solid $dark-theme-gray-dark;
  }
  .service-table__column-info .mdi {
    color: $dark-theme-gray-lightest;
  }

  .service-table__row {
    border-bottom: 1px solid $dark-theme-gray-darker;

    &:hover {
      background: $dark-theme-gray-darker;
    }
    &.service-table__row--disabled {
      color: $dark-theme-gray;
    }
  }
}

.service-table {
  width: 100%;

  .service-table__toggle {
    width: 60px;

    .franz-form__field {
      margin-bottom: 0;
    }
  }

  .service-table__icon {
    width: 35px;

    &.has-custom-icon {
      border: 1px solid $theme-gray-lighter;
      border-radius: $theme-border-radius;
      width: 37px;
    }
  }

  .service-table__column-icon,
  .service-table__column-action {
    width: 40px;
  }

  .service-table__column-info {
    width: 40px;

    .mdi {
      color: $theme-gray-light;
      display: block;
      font-size: 18px;
    }
  }

  .service-table__row {
    border-bottom: 1px solid $theme-gray-lightest;

    &:hover {
      background: $theme-gray-lightest;
    }

    &.service-table__row--disabled {
      color: $theme-gray-light;

      .service-table__column-icon {
        filter: grayscale(100%);
        opacity: 0.5;
      }
    }
  }

  td {
    padding: 10px;
  }
}