Proyectos de Subversion Moodle

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1 
//
2 
// Base styles
3 
//
4 
 
5 
.accordion-button {
6 
  position: relative;
7 
  display: flex;
8 
  align-items: center;
9 
  width: 100%;
10 
  padding: $accordion-button-padding-y $accordion-button-padding-x;
11 
  @include font-size($font-size-base);
12 
  font-weight: $font-weight-bold;
13 
  color: $accordion-button-color;
14 
  text-align: left; // Reset button style
15 
  background-color: $accordion-button-bg;
16 
  border: 0;
17 
  @include border-radius(0);
18 
  overflow-anchor: none;
19 
  @include transition($accordion-transition);
20 
 
21 
  .theme-dark & {
22 
    background-color: $dm-accordion-button-bg;
23 
    color: $dm-accordion-button-color;
24 
  }
25 
 
26 
  &:not(.collapsed) {
27 
    color: $accordion-button-active-color;
28 
    background-color: $accordion-button-active-bg;
29 
 
30 
    .theme-dark & {
31 
      color: $dm-accordion-button-active-color;
32 
      background-color: $dm-accordion-button-active-bg;
33 
    }
34 
 
35 
    &::after {
36 
      background-image: escape-svg($accordion-button-active-icon);
37 
      transform: $accordion-icon-transform;
38 
 
39 
      .theme-dark & {
40 
        background-image: escape-svg($dm-accordion-button-active-icon);
41 
      }
42 
    }
43 
  }
44 
 
45 
  // Accordion icon
46 
  &::after {
47 
    flex-shrink: 0;
48 
    width: $accordion-icon-width;
49 
    height: $accordion-icon-width;
50 
    margin-left: auto;
51 
    content: "";
52 
    background-image: escape-svg($accordion-button-icon);
53 
    background-repeat: no-repeat;
54 
    background-size: $accordion-icon-width;
55 
    @include transition($accordion-icon-transition);
56 
 
57 
    .theme-dark & {
58 
      background-image: escape-svg($dm-accordion-button-icon);
59 
    }
60 
  }
61 
 
62 
  &:hover {
63 
    z-index: 2;
64 
  }
65 
 
66 
  &:focus {
67 
    z-index: 3;
68 
    border-color: $accordion-button-focus-border-color;
69 
    outline: 0;
70 
    box-shadow: $accordion-button-focus-box-shadow;
71 
 
72 
    .theme-dark & {
73 
      border-color: $dm-accordion-button-focus-border-color;
74 
    }
75 
  }
76 
}
77 
 
78 
.accordion-header {
79 
  margin-bottom: 0;
80 
  line-height: 1.5;
81 
}
82 
 
83 
.accordion-item {
84 
  background-color: $accordion-bg;
85 
  border: $accordion-border-width solid $accordion-border-color;
86 
 
87 
  .theme-dark & {
88 
    background-color: $dm-accordion-bg;
89 
    border: $accordion-border-width solid $dm-accordion-border-color;
90 
  }
91 
 
92 
  &:first-of-type {
93 
    @include border-top-radius($accordion-border-radius);
94 
 
95 
    .accordion-button {
96 
      @include border-top-radius($accordion-inner-border-radius);
97 
    }
98 
  }
99 
 
100 
  &:not(:first-of-type) {
101 
    border-top: 0;
102 
  }
103 
 
104 
  // Only set a border-radius on the last item if the accordion is collapsed
105 
  &:last-of-type {
106 
    @include border-bottom-radius($accordion-border-radius);
107 
 
108 
    .accordion-button {
109 
      &.collapsed {
110 
        @include border-bottom-radius($accordion-inner-border-radius);
111 
      }
112 
    }
113 
 
114 
    .accordion-collapse {
115 
      @include border-bottom-radius($accordion-border-radius);
116 
    }
117 
  }
118 
}
119 
 
120 
.accordion-body {
121 
  padding: $accordion-body-padding-y $accordion-body-padding-x;
122 
}
123 
 
124 
 
125 
// Flush accordion items
126 
//
127 
// Remove borders and border-radius to keep accordion items edge-to-edge.
128 
 
129 
.accordion-flush {
130 
  .accordion-collapse {
131 
    border-width: 0;
132 
  }
133 
 
134 
  .accordion-item {
135 
    border-right: 0;
136 
    border-left: 0;
137 
    @include border-radius(0);
138 
 
139 
    &:first-child { border-top: 0; }
140 
    &:last-child { border-bottom: 0; }
141 
 
142 
    .accordion-button {
143 
      @include border-radius(0);
144 
    }
145 
  }
146 
}