sidebar-downloads.css

.download {
	position: relative;
}
.download.complete:hover {
	cursor: pointer;
}
.download:hover,
.download.deleted:hover {
	cursor: default;
}
.download.in_progress {
	padding-bottom: 1.4rem;
}
	.download::before {
		content: '';
		width: .9rem;
		height: .9rem;
		position: absolute;
		left: 0;
		top: 0.05rem;
		background-size: 100% 100%;
		background-color: var(--font-color);
		-webkit-mask-repeat: no-repeat;
		-webkit-mask-size: 100% 100%;
		-webkit-mask-mode: alpha;
		mask-repeat: no-repeat;
		mask-size: 100% 100%;
		mask-mode: alpha;
	}
	.download.in_progress::before {
		top: .9rem;
	}
	.download.complete::before {
		-webkit-mask-image: url(icons/folder.svg);
		mask-image: url(icons/folder.svg);
	}
	.download.deleted::before {
		-webkit-mask-image: url("icons/close.svg");
		mask-image: url("icons/close.svg");
	}
	.download.in_progress::before {
		-webkit-mask-image: url("icons/resume.svg");
		mask-image: url("icons/resume.svg");
	}
	.download.interrupted::before {
		-webkit-mask-image: url("icons/attention.svg");
		mask-image: url("icons/attention.svg");
	}
	.download.in_progress.paused::before {
		-webkit-mask-image: url("icons/pause.svg");
		mask-image: url("icons/pause.svg");
	}
.download.deleted,
.download.interrupted {
	text-decoration: line-through;
}
	.download>.status {
		display: none;
	}
	.download.in_progress>.status {
		display: block;
	}
		.download>.status>.progress-bar {
			position: absolute;
			width: 100%;
			height: .2rem;
			border-width: .1rem;
			border-color: var(--border-color);
			border-style: solid;
			display: none;
			margin: 0 .2rem;
			bottom: .8rem;
			left: 0;
			margin-left: 1.4rem;
		}
		.download.in_progress>.status>.progress-bar,
		.download.in_progress>.status>.recived,
		.download.interrupted>.status>.progress-bar,
		.download.interrupted>.status>.recived {
			display: block;
		}
			.download>.status>.progress-bar>span {
				display: block;
				height: 100%;
				background-color: green;
			}
			.download.interrupted>.status>.progress-bar>span {
				background-color: red;
			}
		.download>.status>.recived {
			display: none;
			width: 100%;
			overflow: hidden;
			font-size: .7rem;
			margin: 0 .2rem;
			position: absolute;
			left: 0;
			bottom: 0rem;
			padding-left: 1.4rem;
		}
		.download>.status>.file-size {
			display: none;
			padding-top: .4rem;
			overflow: hidden;
		}
		.download.complete>.status>.file-size {
			display: block;
		}

#downloads-delete,
.download.interrupted #downloads-reload,
.download.complete #downloads-reload,
.download.in_progress #downloads-pause,
.download.in_progress #downloads-cancel,
.download.in_progress.paused #downloads-resume {
	display: inline-block;
}
.download.in_progress.paused #downloads-pause {
	display: none;
}