@import "../less/keyframes";

.taskbar {
	display: none;
	z-index: 10001;

	margin-top: 0;
	.transition(.15s ease-in opacity);

	background: none;
	border: none;

	&[data-active="1"] {
		display: block;
	}

	&:hover {
		-moz-opacity: 1;
		opacity: 1;
	}

	&.navbar {
		min-height: 32px;
	}

	.navbar-nav {
		padding-right: 15px;
		padding-bottom: 15px;

		li {
			float: left;

			&.new a {
				-webkit-animation: taskbar-active 3s infinite;
				-moz-animation: taskbar-active 3s infinite;
				-o-animation: taskbar-active 3s infinite;
				animation: taskbar-active 3s infinite;
			}

			a {
				padding: 3px 15px;
				font-size: 13px;

				border-radius: 50%;
				height: 50px;
				width: 50px;

				> span {
					display: none;
				}
			}

			img {
				max-width: 24px;
				max-height: 24px;
				margin-right: 1em;
			}

			&.pulse {
				-webkit-animation: pulsate 2500ms linear;
				-webkit-animation-iteration-count: infinite;
			}

			@-webkit-keyframes pulsate {
				0% { background: none; }
				50% { background: #e5e5e5; }
				100% { background: none; }
			}

			&.taskbar-composer {
				a, a:hover, a:focus, a:active {
					background: #f44336;
				}
			}

			&.taskbar-chat {
				a, a:hover, a:focus, a:active {
					background: none;
					background-size: cover;

					i {
						color: @gray;
					}
				}
			}

			&.taskbar-composer, &.taskbar-chat {
				a {
					text-align: center;
					margin-left: 15px;

					i {
						font-size: 18px;
						line-height: 42px;
						color: #FFF;
					}
				}
			}
		}
	}


	@media (max-width: 979px) {
		/*
	 		Gets in the way of entering text when writing posts
		*/
		display: none !important;
	}
}