phui-tag-view.css
No OneTemporary
Actions

Size

11 KB

Referenced Files

None

Subscribers

None

phui-tag-view.css
View Options

	/**
	* @provides phui-tag-view-css
	*/

	.phui-tag-view {
	font-weight: bold;
	text-decoration: none;
	position: relative;
	-webkit-font-smoothing: antialiased;
	white-space: nowrap;
	}

	a.phui-tag-view:hover {
	text-decoration: none;
	}

	.phui-tag-core-closed {
	text-decoration: line-through;
	color: rgba({$alphablack},0.5);
	}

	.phui-tag-core-closed:hover {
	text-decoration: none;
	}

	.phui-tag-core {
	color: inherit;
	border: 1px solid transparent;
	border-radius: 3px;
	padding: 0 4px;
	}

	.phui-tag-type-state .phui-tag-core {
	padding: 1px 6px;
	}

	.phui-tag-view.phui-tag-type-state .phui-icon-view {
	margin: 0 6px 0 0;
	}

	.phui-tag-view .phui-icon-view {
	display: inline-block;
	margin: 0 4px 0 2px;
	}

	.phui-tag-dot {
	position: relative;
	display: inline-block;
	width: 5px;
	height: 5px;
	margin-right: 4px;
	top: -1px;
	border-radius: 5px;
	border: 1px solid transparent;
	}

	.tokenizer-result .phui-tag-dot {
	margin-right: 6px;
	}

	.jx-tokenizer-token .phui-tag-dot {
	margin-left: 2px;
	}

	.phui-tag-type-state {
	color: #ffffff;
	text-shadow: rgba(100, 100, 100, 0.40) 0px -1px 1px;
	}

	.phui-tag-type-object,
	a.phui-tag-type-object,
	a.phui-tag-type-object:link,
	.phui-tag-core-closed .phui-tag-color-object {
	color: {$blacktext};
	}

	.phui-tag-type-person {
	white-space: nowrap;
	color: {$anchor};
	}

	.phui-tag-color-red {
	background-color: {$red};
	border-color: {$red};
	}

	.phui-tag-color-orange {
	background-color: {$orange};
	border-color: {$orange};
	}

	.phui-tag-color-yellow {
	background-color: {$yellow};
	border-color: {$yellow};
	}

	.phui-tag-color-blue {
	background-color: {$blue};
	border-color: {$blue};
	}

	.phui-tag-color-indigo {
	background-color: {$indigo};
	border-color: {$indigo};
	}

	.phui-tag-color-green {
	background-color: {$green};
	border-color: {$green};
	}

	.phui-tag-color-violet {
	background-color: {$violet};
	border-color: {$violet};
	}

	.phui-tag-color-black {
	background-color: {$darkgreybackground};
	border-color: {$darkgreybackground};
	}

	.phui-tag-color-grey {
	background-color: {$lightgreytext};
	border-color: {$lightgreytext};
	}

	.phui-tag-color-white {
	background-color: {$lightgreybackground};
	border-color: {$lightgreybackground};
	}

	.phui-tag-color-object {
	background-color: {$greybackground};
	border-color: {$lightgreyborder};
	}

	.phui-tag-color-person {
	background-color: {$bluebackground};
	border-color: {$thinblueborder};
	}

	a.phui-tag-view:hover
	.phui-tag-core.phui-tag-color-person {
	border-color: {$lightblueborder};
	}

	a.phui-tag-view:hover
	.phui-tag-core.phui-tag-color-object {
	border-color: {$greyborder};
	}

	.phabricator-handle-tag-list-item + .phabricator-handle-tag-list-item {
	margin-top: 4px;
	}

	.phui-oi .phabricator-handle-tag-list {
	display: inline;
	}

	.phui-oi .phabricator-handle-tag-list-item {
	display: inline-block;
	margin: 0 4px 2px 0;
	}

	.phui-tag-view.phui-tag-border-none .phui-tag-core {
	border-color: transparent;
	}

	a.phui-tag-view:hover.phui-tag-border-none .phui-tag-core {
	border-color: transparent !important;
	text-decoration: underline;
	}


	/* - Shaded Tags ---------------------------------------------------------------

	For object representation inside text areas and lists.

	*/

	.phui-tag-view.phui-tag-type-shade {
	font-weight: normal;
	}

	.phui-tag-view.phui-tag-type-shade .phui-icon-view {
	font-size: 12px;
	}


	/* - Slim Tags -----------------------------------------------------------------

	A thinner tag for object list, workboards.

	*/

	.phui-tag-slim .phui-icon-view {
	font-size: 11px;
	}

	.phui-tag-slim .phui-tag-core {
	font-size: {$smallerfontsize};
	}


	/* - Red -------------------------------------------------------------------- */

	.phui-tag-red .phui-tag-core,
	.jx-tokenizer-token.red {
	background: {$sh-redbackground};
	border-color: {$sh-lightredborder};
	color: {$sh-redtext};
	}

	.phui-tag-red .phui-icon-view,
	.jx-tokenizer-token.red .phui-icon-view,
	.jx-tokenizer-token.red .jx-tokenizer-x {
	color: {$sh-redicon};
	}

	a.phui-tag-view:hover.phui-tag-red .phui-tag-core,
	.jx-tokenizer-token.red:hover {
	border-color: {$sh-redborder};
	}

	/* - Orange ----------------------------------------------------------------- */

	.phui-tag-orange .phui-tag-core,
	.jx-tokenizer-token.orange {
	background: {$sh-orangebackground};
	border-color: {$sh-lightorangeborder};
	color: {$sh-orangetext};
	}

	.phui-tag-orange .phui-icon-view,
	.jx-tokenizer-token.orange .phui-icon-view,
	.jx-tokenizer-token.orange .jx-tokenizer-x {
	color: {$sh-orangeicon};
	}

	a.phui-tag-view:hover.phui-tag-orange .phui-tag-core,
	.jx-tokenizer-token.orange:hover {
	border-color: {$sh-orangeborder};
	}

	/* - Yellow ----------------------------------------------------------------- */

	.phui-tag-yellow .phui-tag-core,
	.jx-tokenizer-token.yellow {
	background: {$sh-yellowbackground};
	border-color: {$sh-lightyellowborder};
	color: {$sh-yellowtext};
	}

	.phui-tag-yellow .phui-icon-view,
	.jx-tokenizer-token.yellow .phui-icon-view,
	.jx-tokenizer-token.yellow .jx-tokenizer-x {
	color: {$sh-yellowicon};
	}

	a.phui-tag-view:hover.phui-tag-yellow .phui-tag-core,
	.jx-tokenizer-token.yellow:hover {
	border-color: {$sh-yellowborder};
	}

	/* - Blue ------------------------------------------------------------------- */

	.phui-tag-blue .phui-tag-core,
	.jx-tokenizer-token.blue {
	background: {$sh-bluebackground};
	border-color: {$sh-lightblueborder};
	color: {$sh-bluetext};
	}

	.phui-tag-blue .phui-icon-view,
	.jx-tokenizer-token.blue .phui-icon-view,
	.jx-tokenizer-token.blue .jx-tokenizer-x {
	color: {$sh-blueicon};
	}

	a.phui-tag-view:hover.phui-tag-blue .phui-tag-core,
	.jx-tokenizer-token.blue:hover {
	border-color: {$sh-blueborder};
	}

	/* - Sky ------------------------------------------------------------------- */

	.phui-tag-sky .phui-tag-core,
	.jx-tokenizer-token.sky {
	background: #E0F0FA;
	border-color: {$sh-lightblueborder};
	color: {$sh-bluetext};
	}

	.phui-tag-sky .phui-icon-view,
	.jx-tokenizer-token.sky .phui-icon-view,
	.jx-tokenizer-token.sky .jx-tokenizer-x {
	color: {$sh-blueicon};
	}

	a.phui-tag-view:hover.phui-tag-sky .phui-tag-core,
	.jx-tokenizer-token.sky:hover {
	border-color: {$sh-blueborder};
	}

	/* - Indigo ----------------------------------------------------------------- */

	.phui-tag-indigo .phui-tag-core,
	.jx-tokenizer-token.indigo {
	background: {$sh-indigobackground};
	border-color: {$sh-lightindigoborder};
	color: {$sh-indigotext};
	}

	.phui-tag-indigo .phui-icon-view,
	.jx-tokenizer-token.indigo .phui-icon-view,
	.jx-tokenizer-token.indigo .jx-tokenizer-x {
	color: {$sh-indigoicon};
	}

	a.phui-tag-view:hover.phui-tag-indigo .phui-tag-core,
	.jx-tokenizer-token.indigo:hover {
	border-color: {$sh-indigoborder};
	}

	/* - Green ------------------------------------------------------------------ */

	.phui-tag-green .phui-tag-core,
	.jx-tokenizer-token.green {
	background: {$sh-greenbackground};
	border-color: {$sh-lightgreenborder};
	color: {$sh-greentext};
	}

	.phui-tag-green .phui-icon-view,
	.jx-tokenizer-token.green .phui-icon-view,
	.jx-tokenizer-token.green .jx-tokenizer-x {
	color: {$sh-greenicon};
	}

	a.phui-tag-view:hover.phui-tag-green .phui-tag-core,
	.jx-tokenizer-token.green:hover {
	border-color: {$sh-greenborder};
	}

	/* - Violet ----------------------------------------------------------------- */

	.phui-tag-violet .phui-tag-core,
	.jx-tokenizer-token.violet {
	background: {$sh-violetbackground};
	border-color: {$sh-lightvioletborder};
	color: {$sh-violettext};
	}

	.phui-tag-violet .phui-icon-view,
	.jx-tokenizer-token.violet .phui-icon-view,
	.jx-tokenizer-token.violet .jx-tokenizer-x {
	color: {$sh-violeticon};
	}

	a.phui-tag-view:hover.phui-tag-violet .phui-tag-core,
	.jx-tokenizer-token.violet:hover {
	border-color: {$sh-violetborder};
	}

	/* - Pink ------------------------------------------------------------------- */

	.phui-tag-pink .phui-tag-core,
	.jx-tokenizer-token.pink {
	background: {$sh-pinkbackground};
	border-color: {$sh-lightpinkborder};
	color: {$sh-pinktext};
	}

	.phui-tag-pink .phui-icon-view,
	.jx-tokenizer-token.pink .phui-icon-view,
	.jx-tokenizer-token.pink .jx-tokenizer-x {
	color: {$sh-pinkicon};
	}

	a.phui-tag-view:hover.phui-tag-pink .phui-tag-core,
	.jx-tokenizer-token.pink:hover {
	border-color: {$sh-pinkborder};
	}

	/* - Grey ------------------------------------------------------------------- */

	.phui-tag-grey .phui-tag-core,
	.jx-tokenizer-token.grey {
	background: {$sh-greybackground};
	border-color: {$sh-lightgreyborder};
	color: {$sh-greytext};
	}

	.phui-tag-grey .phui-icon-view,
	.jx-tokenizer-token.grey .phui-icon-view,
	.jx-tokenizer-token.grey .jx-tokenizer-x {
	color: {$sh-greyicon};
	}

	a.phui-tag-view:hover.phui-tag-grey .phui-tag-core,
	.jx-tokenizer-token.grey:hover {
	border-color: {$sh-greyborder};
	}

	/* - Checkered -------------------------------------------------------------- */

	.phui-tag-checkered .phui-tag-core,
	.jx-tokenizer-token.checkered {
	background: url(/rsrc/image/checker_lighter.png);
	border-style: dashed;
	border-color: {$sh-greyborder};
	color: {$sh-greytext};
	text-shadow: 1px 1px #fff;
	}

	.phui-tag-checkered .phui-icon-view,
	.jx-tokenizer-token.checkered .phui-icon-view,
	.jx-tokenizer-token.checkered .jx-tokenizer-x {
	color: {$sh-greyicon};
	}

	a.phui-tag-view:hover.phui-tag-checkered .phui-tag-core,
	.jx-tokenizer-token.checkered:hover {
	border-style: solid;
	border-color: {$sh-greyborder};
	}

	/* - Disabled --------------------------------------------------------------- */

	.phui-tag-disabled .phui-tag-core {
	background-color: {$sh-disabledbackground};
	border-color: {$sh-lightdisabledborder};
	color: {$sh-disabledtext};
	}

	.phui-tag-disabled .phui-icon-view {
	color: {$sh-disabledicon};
	}

	a.phui-tag-view:hover.phui-tag-disabled .phui-tag-core {
	border-color: {$sh-disabledborder};
	}

	.phui-tag-placeholder .phui-tag-core {
	border-color: transparent;
	background-color: {$sh-disabledbackground};
	opacity: 0.5;
	}

	/* - Outline Tags --------------------------------------------------------------

	Basic Tag with a bold border and white background

	*/

	.phui-tag-type-outline {
	text-transform: uppercase;
	font-weight: normal;
	}

	.phui-tag-view.phui-tag-type-outline .phui-tag-core {
	background: #fff;
	padding: 0 6px 1px 6px;
	}

	.phui-tag-slim.phui-tag-type-outline .phui-tag-core {
	font-size: {$smallestfontsize};
	}

	.phui-tag-type-outline.phui-tag-red .phui-tag-core {
	color: {$red};
	border-color: {$red};
	}

	.phui-tag-type-outline.phui-tag-orange .phui-tag-core {
	color: {$orange};
	border-color: {$orange};
	}

	.phui-tag-type-outline.phui-tag-yellow .phui-tag-core {
	color: {$yellow};
	border-color: {$yellow};
	}

	.phui-tag-type-outline.phui-tag-green .phui-tag-core {
	color: {$green};
	border-color: {$green};
	}

	.phui-tag-type-outline.phui-tag-blue .phui-tag-core {
	color: {$blue};
	border-color: {$blue};
	}

	.phui-tag-type-outline.phui-tag-indigo .phui-tag-core {
	color: {$indigo};
	border-color: {$indigo};
	}

	.phui-tag-type-outline.phui-tag-violet .phui-tag-core {
	color: {$violet};
	border-color: {$violet};
	}

	.phui-tag-type-outline.phui-tag-grey .phui-tag-core {
	color: {$bluetext};
	border-color: {$bluetext};
	}

	.phui-tag-type-outline.phui-tag-disabled .phui-tag-core {
	color: {$lightgreytext};
	border-color: {$lightgreytext};
	}

	.phui-tag-type-outline.phui-tag-pink .phui-tag-core {
	color: {$pink};
	border-color: {$pink};
	}

	.phui-tag-type-outline.phui-tag-sky .phui-tag-core {
	color: {$sky};
	border-color: {$sky};
	}

	.phui-tag-type-outline.phui-tag-fire .phui-tag-core {
	color: {$fire};
	border-color: {$fire};
	}

	.phui-tag-type-outline.phui-tag-black .phui-tag-core {
	color: {$blacktext};
	border-color: {$blacktext};
	}

	.phui-tag-exiled .phui-tag-core {
	border-color: {$lightredborder};
	color: {$red};
	background: {$lightredbackground};
	}


	a.phui-tag-view.phui-tag-exiled:hover
	.phui-tag-core.phui-tag-color-person {
	border-color: {$red};
	}

File Metadata

Mime Type: text/plain
Expires: Sun, Jan 19, 14:22 (3 w, 2 d ago)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 1125454
Default Alt Text: phui-tag-view.css (11 KB)

phui-tag-view.cssNo OneTemporaryActions

phui-tag-view.cssView Options

File Metadata

Event Timeline

phui-tag-view.css
No OneTemporary
Actions

phui-tag-view.css
View Options