Proyectos de Subversion Moodle

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1 
// Disable animation if transitions are disabled
2 
@if $enable-transitions {
3 
  @keyframes progress-bar-stripes {
4 
    from {
5 
      background-position: $progress-height 0;
6 
    }
7 
 
8 
    to {
9 
      background-position: 0 0;
10 
    }
11 
  }
12 
}
13 
 
14 
.progress,
15 
.rui-progress {
16 
  display: flex;
17 
  height: $progress-height;
18 
  overflow: hidden; // force rounded corners by cropping it
19 
  line-height: 0;
20 
  @include font-size($progress-font-size);
21 
  background-color: $progress-bg;
22 
  @include border-radius($progress-border-radius);
23 
  //@include box-shadow($progress-box-shadow);
24 
 
25 
  .rui-course-card-progress-bar &,
26 
  .rui-course-card & {
27 
    height: 4px;
28 
    border-radius: 4px;
29 
  }
30 
 
31 
  .theme-dark & {
32 
    background-color: $dm-progress-bg;
33 
  }
34 
}
35 
 
36 
.rui-course-card {
37 
  .rui-course-card-progress-bar {
38 
    padding: 0 20px;
39 
    align-self: flex-end;
40 
  }
41 
}
42 
 
43 
.rui-progress-bar,
44 
.progress-bar {
45 
  display: flex;
46 
  flex-direction: column;
47 
  justify-content: center;
48 
  overflow: hidden;
49 
  color: $progress-bar-color;
50 
  text-align: center;
51 
  white-space: nowrap;
52 
  background: $primary-color-600;
53 
  background: linear-gradient(90deg, rgba($primary-color-600, 1) 0%, rgba($primary-color-400, 1) 100%);
54 
 
55 
  .rui-progress-100 & {
56 
    background: $green-600;
57 
    background: linear-gradient(90deg, rgba($green-600, 1) 0%, rgba($green-400, 1) 100%);
58 
  }
59 
 
60 
  @include transition($progress-bar-transition);
61 
  border-radius: 10px;
62 
}
63 
 
64 
.progress-bar .sr-only {
65 
  display: block !important;
66 
  width: max-content;
67 
  overflow: initial;
68 
  margin: 0;
69 
  font-size: 11px;
70 
  font-weight: $font-weight-medium;
71 
  clip: auto;
72 
  padding: 6px;
73 
 
74 
  .format-remuiformat & {
75 
    display: none!important;
76 
  }
77 
}
78 
 
79 
.rui-progress-bar-striped {
80 
  @include gradient-striped();
81 
  background-size: $progress-height $progress-height;
82 
}
83 
 
84 
@if $enable-transitions {
85 
  .rui-progress-bar-animated {
86 
    animation: $progress-bar-animation-timing progress-bar-stripes;
87 
 
88 
    @if $enable-prefers-reduced-motion-media-query {
89 
      @media (prefers-reduced-motion: reduce) {
90 
        animation: none;
91 
      }
92 
    }
93 
  }
94 
}
95 
 
96 
.rui-progress--value--100 {
97 
  left: auto !important;
98 
  right: 5px;
99 
}
100 
 
101 
.rui-course-progressbar {
102 
 
103 
  .drawer & {
104 
    position: sticky;
105 
    top: 0;
106 
    z-index: 10;
107 
    background-color: rgba($container-bg, .8);
108 
    backdrop-filter: blur(10px);
109 
    -webkit-backdrop-filter: blur(10px);
110 
 
111 
    .theme-dark & {
112 
      background-color: $dm-body-bg;
113 
    }
114 
  }
115 
 
116 
  &:hover {
117 
    text-decoration: none;
118 
  }
119 
}
120 
 
121 
.rui-progress-count {
122 
  margin: 0 0 0 10px;
123 
  display: inline-flex;
124 
  align-items: center;
125 
 
126 
  font-size: $font-size-xs;
127 
  font-weight: $font-weight-bold;
128 
 
129 
  .rui-progress-count-total {
130 
    margin-left: .25rem;
131 
    opacity: .6;
132 
  }
133 
}
134 
 
135 
.rui-progress-count--text {
136 
  font-size: $font-size-sm;
137 
  color: $body-color-light;
138 
 
139 
  .theme-dark & {
140 
    color: $dm-body-color-light;
141 
  }
142 
}