friendica_2021-01/view/theme/quattro/icons.less

// Quattro Theme LESS file
/* icons */

.icons(@size: 22) {
	&.notify { background-image: url("../../../images/icons/@{size}/notify_off.png"); }
	&.gear 	 { background-image: url("../../../images/icons/@{size}/gear.png"); }
	
    &.like 	 { background-image: url("icons/like.png"); }
	&.dislike 	 { background-image: url("icons/dislike.png"); }
	
	&.add 	 	{ background-image: url("../../../images/icons/@{size}/add.png"); }
	&.delete 	{ background-image: url("../../../images/icons/@{size}/delete.png"); }
	&.edit 	 	{ background-image: url("../../../images/icons/@{size}/edit.png"); }
	&.star	 	{ background-image: url("../../../images/icons/@{size}/star.png"); }
	&.menu		{ background-image: url("../../../images/icons/@{size}/menu.png"); }
	&.link		{ background-image: url("../../../images/icons/@{size}/link.png"); }
	&.lock		{ background-image: url("../../../images/icons/@{size}/lock.png"); }
	&.unlock	{ background-image: url("../../../images/icons/@{size}/unlock.png"); }
	&.plugin	{ background-image: url("../../../images/icons/@{size}/plugin.png"); }
	&.type-unkn	{ background-image: url("../../../images/icons/@{size}/zip.png"); }
	&.type-audio{ background-image: url("../../../images/icons/@{size}/audio.png"); }
	&.type-video{ background-image: url("../../../images/icons/@{size}/video.png"); }
	&.type-image{ background-image: url("../../../images/icons/@{size}/image.png"); }
	&.type-text	{ background-image: url("../../../images/icons/@{size}/text.png"); }

	&.language	{ background-image: url("icons/language.png"); }


	
}


.icon {
	background-color: transparent ;
	background-repeat: no-repeat;
	background-position: left center;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	padding: 1px;

	&.text {
		text-indent: 0px;
	}

    min-width:22px; height: 22px;
    .icons(22);
    &.text { padding: 10px 0px 0px 25px;  }

	&.s10 {
		min-width:10px; height: 10px;
		.icons(10);
		&.text { padding: 2px 0px 0px 15px;  }
	}
	&.s16 {
		min-width:16px; height: 16px;
		.icons(16);
		&.text { padding: 4px 0px 0px 20px;  }
	}
	&.s22 {
		min-width:22px; height: 22px;
		.icons(22);
		&.text { padding: 10px 0px 0px 25px;  }
	}
	&.s48 {
		width:48px; height: 48px;
		.icons(48);
	}
	
        &.on {
            background-image: url("icons/addon_on.png");
	    min-width:16px;
            height: 16px;
            background-position: 0px 0px;
        }
        &.off {
            background-image: url("icons/addon_off.png");
	    width: 16px;
            height: 16px;
            background-position: 0px 0px;
        }
	
}