Proyectos de Subversion Moodle

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1 
.rui-breadcrumbs {
2 
  margin-top: 20px;
3 
  margin-bottom: 20px;
4 
 
5 
  @include media-breakpoint-between(xs, sm) {
6 
  margin-top: 6px;
7 
  }
8 
}
9 
 
10 
.breadcrumb,
11 
.coursefilesbreadcrumb {
12 
  display: flex;
13 
  flex-wrap: wrap;
14 
  padding: 0;
15 
  margin: 0;
16 
 
17 
  z-index: 0;
18 
 
19 
  @include font-size($breadcrumb-font-size);
20 
  list-style: none;
21 
 
22 
  @include media-breakpoint-between(xs, sm) {
23 
    width: max-content;
24 
    justify-content: center;
25 
    margin: 0 auto;
26 
  }
27 
}
28 
 
29 
.breadcrumbs-container {
30 
  @include media-breakpoint-up(lg) {
31 
    width: 100%;
32 
  }
33 
 
34 
  @include media-breakpoint-between(xs, sm) {
35 
    margin-left: auto;
36 
    margin-right: auto;
37 
    padding: 0 0 5px;
38 
    overflow-x: auto;
39 
 
40 
    .pagelayout-incourse &,
41 
    .pagelayout-course & {
42 
      width: calc(100% - 100px);
43 
    }
44 
  }
45 
 
46 
}
47 
 
48 
.breadcrumb--in-content {
49 
  margin: 0;
50 
}
51 
 
52 
.breadcrumb-item {
53 
  display: flex;
54 
  color: $breadcrumb-color;
55 
 
56 
  &:hover {
57 
    color: $link-hover-color;
58 
  }
59 
 
60 
  .theme-dark & {
61 
    color: $dm-breadcrumb-color;
62 
  }
63 
 
64 
  &:first-child {
65 
    a {
66 
      color: $body-color-light;
67 
 
68 
      .theme-dark & {
69 
        color: $dm-body-color-light;
70 
      }
71 
    }
72 
  }
73 
 
74 
  .text-truncate {
75 
    max-width: 300px;
76 
  }
77 
 
78 
  // The separator between breadcrumbs (by default, a forward-slash: "/")
79 
  +.breadcrumb-item {
80 
 
81 
    &::before {
82 
      display: inline-flex; // Suppress underlining of the separator in modern browsers
83 
      align-items: center;
84 
      padding-right: $breadcrumb-item-padding;
85 
      font-size: 10px;
86 
      color: $breadcrumb-divider-color;
87 
      content: escape-svg($breadcrumb-divider);
88 
 
89 
      .theme-dark & {
90 
        color: $dm-breadcrumb-divider-color;
91 
      }
92 
    }
93 
  }
94 
 
95 
  &.breadcrumb-item--last {
96 
    opacity: .6;
97 
  }
98 
 
99 
  // IE9-11 hack to properly handle hyperlink underlines for breadcrumbs built
100 
  // without `<ul>`s. The `::before` pseudo-element generates an element
101 
  // *within* the .breadcrumb-item and thereby inherits the `text-decoration`.
102 
  //
103 
  // To trick IE into suppressing the underline, we give the pseudo-element an
104 
  // underline and then immediately remove it.
105 
  +.breadcrumb-item:hover::before {
106 
    text-decoration: underline;
107 
  }
108 
 
109 
  // stylelint-disable-next-line no-duplicate-selectors
110 
  +.breadcrumb-item:hover::before {
111 
    text-decoration: none;
112 
  }
113 
 
114 
 
115 
  &.active {
116 
    color: $breadcrumb-active-color;
117 
 
118 
    &:after {
119 
      content: '';
120 
      background-color: var(--primary-color-100);
121 
 
122 
      border-radius: $btn-border-radius;
123 
 
124 
      position: absolute;
125 
      left: -3px;
126 
      top: -2px;
127 
      width: calc(100% + 6px);
128 
      height: calc(100% + 4px);
129 
      z-index: -1;
130 
 
131 
      .theme-dark & {
132 
        background-color: $dm-gray-700;
133 
      }
134 
    }
135 
 
136 
    .theme-dark & {
137 
      color: $dm-breadcrumb-active-color;
138 
    }
139 
  }
140 
 
141 
  .breadcrumbs-textonly {
142 
    margin: 0.25rem 0;
143 
    display: grid;
144 
    color: $breadcrumb-active-color;
145 
  }
146 
 
147 
  a,
148 
  .breadcrumbs-textonly {
149 
    position: relative;
150 
    display: inline-flex;
151 
    z-index: 1;
152 
 
153 
    padding: 3px 0;
154 
    margin: .25rem 8px .25rem 0;
155 
 
156 
    transition: $transition-base;
157 
  }
158 
 
159 
  a {
160 
    color: $breadcrumb-color;
161 
    font-weight: $font-weight-medium;
162 
 
163 
    .theme-dark & {
164 
      color: $dm-breadcrumb-color;
165 
    }
166 
 
167 
    .text-truncate {
168 
      display: inline-block;
169 
      max-width: 200px;
170 
    }
171 
 
172 
    &:hover {
173 
      text-decoration: none;
174 
      color: var(--main-theme-color);
175 
 
176 
      .theme-dark & {
177 
        color: $dm-breadcrumb-active-color;
178 
      }
179 
    }
180 
  }
181 
}