67 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
			
		
		
	
	
			67 lines
		
	
	
		
			1.3 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
| .media-breadcrumb {
 | |
|   display: flex;
 | |
|   padding: 0;
 | |
|   margin-inline-end: auto;
 | |
|   font-size: .9rem;
 | |
|   line-height: $toolbar-height;
 | |
|   background: transparent;
 | |
|   border-inline-start: 1px solid $border-color;
 | |
| 
 | |
|   ol {
 | |
|     display: flex;
 | |
|     padding: 0;
 | |
|     margin: 0;
 | |
|     list-style: outside none none;
 | |
| 
 | |
|     > li > a {
 | |
|       cursor: pointer;
 | |
|     }
 | |
|   }
 | |
| }
 | |
| 
 | |
| .media-breadcrumb-item {
 | |
|   padding-inline-end: 8px;
 | |
|   padding-inline-start: 22px;
 | |
|   background-color: $breadcrumbs-bg;
 | |
|   a {
 | |
|     color: $breadcrumbs-color;
 | |
|   }
 | |
|   &:first-of-type {
 | |
|     padding-inline-start: 16px;
 | |
|   }
 | |
|   &:last-of-type {
 | |
|     background-color: $breadcrumbs-current-bg;
 | |
|     &::after {
 | |
|       border-inline-start-color: $breadcrumbs-current-bg;
 | |
|     }
 | |
|   }
 | |
|   &:hover {
 | |
|     color: $highlight-color;
 | |
|   }
 | |
| }
 | |
| 
 | |
| .media-breadcrumb-item {
 | |
|   position: relative;
 | |
|   &::before, &::after {
 | |
|     position: absolute;
 | |
|     top: 0;
 | |
|     bottom: 0;
 | |
|     inset-inline-start: 100%;
 | |
|     z-index: 2;
 | |
|     display: block;
 | |
|     width: 0;
 | |
|     height: 0;
 | |
|     margin: auto;
 | |
|     content: "" !important;
 | |
|     border-top: 23px solid transparent;
 | |
|     border-bottom: 23px solid transparent;
 | |
|     border-inline-start: 10px solid transparent;
 | |
|   }
 | |
|   &::before {
 | |
|     border-inline-start-color: $border-color;
 | |
|   }
 | |
|   &::after {
 | |
|     border-inline-start-color: $breadcrumbs-bg;
 | |
|   }
 | |
| }
 |