Changeset View
Changeset View
Standalone View
Standalone View
webroot/rsrc/css/phui/phui-tag-view.css
Show First 20 Lines • Show All 134 Lines • ▼ Show 20 Lines | a.phui-tag-view:hover | ||||
border-color: #d9ebfd; | border-color: #d9ebfd; | ||||
} | } | ||||
a.phui-tag-view:hover | a.phui-tag-view:hover | ||||
.phui-tag-core.phui-tag-color-object { | .phui-tag-core.phui-tag-color-object { | ||||
border-color: #d7d7d7; | border-color: #d7d7d7; | ||||
} | } | ||||
.phabricator-handle-tag-list-item + .phabricator-handle-tag-list-item { | |||||
margin-top: 4px; | |||||
} | |||||
.phui-object-item .phabricator-handle-tag-list { | |||||
display: inline; | |||||
} | |||||
.phui-object-item .phabricator-handle-tag-list-item { | |||||
display: inline; | |||||
margin: 0 4px 2px 0; | |||||
} | |||||
/* - Shaded Tags --------------------------------------------------------------- | /* - Shaded Tags --------------------------------------------------------------- | ||||
For object representation inside text areas and lists. | For object representation inside text areas and lists. | ||||
*/ | */ | ||||
.phui-tag-shade { | .phui-tag-shade { | ||||
font-weight: normal; | font-weight: normal; | ||||
} | } | ||||
.phui-tag-shade .phui-icon-view { | .phui-tag-shade .phui-icon-view { | ||||
font-size: 12px; | font-size: 12px; | ||||
} | } | ||||
.phui-tag-shade-slim .phui-icon-view { | .phui-tag-shade-slim .phui-icon-view { | ||||
font-size: 11px; | font-size: 11px; | ||||
} | } | ||||
.phui-tag-shade-slim .phui-tag-core { | .phui-tag-shade-slim .phui-tag-core { | ||||
font-size: 12px; | font-size: 12px; | ||||
} | } | ||||
.phui-tag-shade-red .phui-tag-core { | /* - Red -------------------------------------------------------------------- */ | ||||
background-color: {$sh-redbackground}; | |||||
.phui-tag-shade-red .phui-tag-core, | |||||
.jx-tokenizer-token.red { | |||||
background: {$sh-redbackground}; | |||||
border-color: {$sh-lightredborder}; | border-color: {$sh-lightredborder}; | ||||
color: {$sh-redtext}; | color: {$sh-redtext}; | ||||
} | } | ||||
.phui-tag-shade-red .phui-icon-view { | .phui-tag-shade-red .phui-icon-view, | ||||
.jx-tokenizer-token.red .phui-icon-view, | |||||
.jx-tokenizer-token.red .jx-tokenizer-x { | |||||
color: {$sh-redicon}; | color: {$sh-redicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-red .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-red .phui-tag-core, | ||||
.jx-tokenizer-token.red:hover { | |||||
border-color: {$sh-redborder}; | border-color: {$sh-redborder}; | ||||
} | } | ||||
.phui-tag-shade-orange .phui-tag-core { | /* - Orange ----------------------------------------------------------------- */ | ||||
background-color: {$sh-orangebackground}; | |||||
.phui-tag-shade-orange .phui-tag-core, | |||||
.jx-tokenizer-token.orange { | |||||
background: {$sh-orangebackground}; | |||||
border-color: {$sh-lightorangeborder}; | border-color: {$sh-lightorangeborder}; | ||||
color: {$sh-orangetext}; | color: {$sh-orangetext}; | ||||
} | } | ||||
.phui-tag-shade-orange .phui-icon-view { | .phui-tag-shade-orange .phui-icon-view, | ||||
.jx-tokenizer-token.orange .phui-icon-view, | |||||
.jx-tokenizer-token.orange .jx-tokenizer-x { | |||||
color: {$sh-orangeicon}; | color: {$sh-orangeicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-orange .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-orange .phui-tag-core, | ||||
.jx-tokenizer-token.orange:hover { | |||||
border-color: {$sh-orangeborder}; | border-color: {$sh-orangeborder}; | ||||
} | } | ||||
.phui-tag-shade-yellow .phui-tag-core { | /* - Yellow ----------------------------------------------------------------- */ | ||||
background-color: {$sh-yellowbackground}; | |||||
.phui-tag-shade-yellow .phui-tag-core, | |||||
.jx-tokenizer-token.yellow { | |||||
background: {$sh-yellowbackground}; | |||||
border-color: {$sh-lightyellowborder}; | border-color: {$sh-lightyellowborder}; | ||||
color: {$sh-yellowtext}; | color: {$sh-yellowtext}; | ||||
} | } | ||||
.phui-tag-shade-yellow .phui-icon-view { | .phui-tag-shade-yellow .phui-icon-view, | ||||
.jx-tokenizer-token.yellow .phui-icon-view, | |||||
.jx-tokenizer-token.yellow .jx-tokenizer-x { | |||||
color: {$sh-yellowicon}; | color: {$sh-yellowicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-yellow .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-yellow .phui-tag-core, | ||||
.jx-tokenizer-token.yellow:hover { | |||||
border-color: {$sh-yellowborder}; | border-color: {$sh-yellowborder}; | ||||
} | } | ||||
.phui-tag-shade-blue .phui-tag-core { | /* - Blue ------------------------------------------------------------------- */ | ||||
background-color: {$sh-bluebackground}; | |||||
.phui-tag-shade-blue .phui-tag-core, | |||||
.jx-tokenizer-token.blue { | |||||
background: {$sh-bluebackground}; | |||||
border-color: {$sh-lightblueborder}; | border-color: {$sh-lightblueborder}; | ||||
color: {$sh-bluetext}; | color: {$sh-bluetext}; | ||||
} | } | ||||
.phui-tag-shade-blue .phui-icon-view { | .phui-tag-shade-blue .phui-icon-view, | ||||
.jx-tokenizer-token.blue .phui-icon-view, | |||||
.jx-tokenizer-token.blue .jx-tokenizer-x { | |||||
color: {$sh-blueicon}; | color: {$sh-blueicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-blue .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-blue .phui-tag-core, | ||||
.jx-tokenizer-token.blue:hover { | |||||
border-color: {$sh-blueborder}; | border-color: {$sh-blueborder}; | ||||
} | } | ||||
.phui-tag-shade-indigo .phui-tag-core { | /* - Indigo ----------------------------------------------------------------- */ | ||||
background-color: {$sh-indigobackground}; | |||||
.phui-tag-shade-indigo .phui-tag-core, | |||||
.jx-tokenizer-token.indigo { | |||||
background: {$sh-indigobackground}; | |||||
border-color: {$sh-lightindigoborder}; | border-color: {$sh-lightindigoborder}; | ||||
color: {$sh-indigotext}; | color: {$sh-indigotext}; | ||||
} | } | ||||
.phui-tag-shade-indigo .phui-icon-view { | .phui-tag-shade-indigo .phui-icon-view, | ||||
.jx-tokenizer-token.indigo .phui-icon-view, | |||||
.jx-tokenizer-token.indigo .jx-tokenizer-x { | |||||
color: {$sh-indigoicon}; | color: {$sh-indigoicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-indigo .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-indigo .phui-tag-core, | ||||
.jx-tokenizer-token.indigo:hover { | |||||
border-color: {$sh-indigoborder}; | border-color: {$sh-indigoborder}; | ||||
} | } | ||||
.phui-tag-shade-green .phui-tag-core { | /* - Green ------------------------------------------------------------------ */ | ||||
background-color: {$sh-greenbackground}; | |||||
.phui-tag-shade-green .phui-tag-core, | |||||
.jx-tokenizer-token.green { | |||||
background: {$sh-greenbackground}; | |||||
border-color: {$sh-lightgreenborder}; | border-color: {$sh-lightgreenborder}; | ||||
color: {$sh-greentext}; | color: {$sh-greentext}; | ||||
} | } | ||||
.phui-tag-shade-green .phui-icon-view { | .phui-tag-shade-green .phui-icon-view, | ||||
.jx-tokenizer-token.green .phui-icon-view, | |||||
.jx-tokenizer-token.green .jx-tokenizer-x { | |||||
color: {$sh-greenicon}; | color: {$sh-greenicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-green .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-green .phui-tag-core, | ||||
.jx-tokenizer-token.green:hover { | |||||
border-color: {$sh-greenborder}; | border-color: {$sh-greenborder}; | ||||
} | } | ||||
.phui-tag-shade-violet .phui-tag-core { | /* - Violet ----------------------------------------------------------------- */ | ||||
background-color: {$sh-violetbackground}; | |||||
.phui-tag-shade-violet .phui-tag-core, | |||||
.jx-tokenizer-token.violet { | |||||
background: {$sh-violetbackground}; | |||||
border-color: {$sh-lightvioletborder}; | border-color: {$sh-lightvioletborder}; | ||||
color: {$sh-violettext}; | color: {$sh-violettext}; | ||||
} | } | ||||
.phui-tag-shade-violet .phui-icon-view { | .phui-tag-shade-violet .phui-icon-view, | ||||
.jx-tokenizer-token.violet .phui-icon-view, | |||||
.jx-tokenizer-token.violet .jx-tokenizer-x { | |||||
color: {$sh-violeticon}; | color: {$sh-violeticon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-violet .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-violet .phui-tag-core, | ||||
.jx-tokenizer-token.violet:hover { | |||||
border-color: {$sh-violetborder}; | border-color: {$sh-violetborder}; | ||||
} | } | ||||
.phui-tag-shade-pink .phui-tag-core { | /* - Pink ------------------------------------------------------------------- */ | ||||
background-color: {$sh-pinkbackground}; | |||||
.phui-tag-shade-pink .phui-tag-core, | |||||
.jx-tokenizer-token.pink { | |||||
background: {$sh-pinkbackground}; | |||||
border-color: {$sh-lightpinkborder}; | border-color: {$sh-lightpinkborder}; | ||||
color: {$sh-pinktext}; | color: {$sh-pinktext}; | ||||
} | } | ||||
.phui-tag-shade-pink .phui-icon-view { | .phui-tag-shade-pink .phui-icon-view, | ||||
.jx-tokenizer-token.pink .phui-icon-view, | |||||
.jx-tokenizer-token.pink .jx-tokenizer-x { | |||||
color: {$sh-pinkicon}; | color: {$sh-pinkicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-pink .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-pink .phui-tag-core, | ||||
.jx-tokenizer-token.pink:hover { | |||||
border-color: {$sh-pinkborder}; | border-color: {$sh-pinkborder}; | ||||
} | } | ||||
.phui-tag-shade-grey .phui-tag-core { | /* - Grey ------------------------------------------------------------------- */ | ||||
background-color: {$sh-greybackground}; | |||||
.phui-tag-shade-grey .phui-tag-core, | |||||
.jx-tokenizer-token.grey { | |||||
background: {$sh-greybackground}; | |||||
border-color: {$sh-lightgreyborder}; | border-color: {$sh-lightgreyborder}; | ||||
color: {$sh-greytext}; | color: {$sh-greytext}; | ||||
} | } | ||||
.phui-tag-shade-grey .phui-icon-view { | .phui-tag-shade-grey .phui-icon-view, | ||||
.jx-tokenizer-token.grey .phui-icon-view, | |||||
.jx-tokenizer-token.grey .jx-tokenizer-x { | |||||
color: {$sh-greyicon}; | color: {$sh-greyicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-grey .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-grey .phui-tag-core, | ||||
.jx-tokenizer-token.grey:hover { | |||||
border-color: {$sh-greyborder}; | border-color: {$sh-greyborder}; | ||||
} | } | ||||
.phui-tag-shade-checkered .phui-tag-core { | /* - Checkered -------------------------------------------------------------- */ | ||||
.phui-tag-shade-checkered .phui-tag-core, | |||||
.jx-tokenizer-token.checkered { | |||||
background: url(/rsrc/image/checker_lighter.png); | background: url(/rsrc/image/checker_lighter.png); | ||||
border-style: dashed; | border-style: dashed; | ||||
border-color: {$sh-greyborder}; | border-color: {$sh-greyborder}; | ||||
color: {$sh-greytext}; | color: {$sh-greytext}; | ||||
text-shadow: 1px 1px #fff; | text-shadow: 1px 1px #fff; | ||||
} | } | ||||
.phui-tag-shade-checkered .phui-icon-view { | .phui-tag-shade-checkered .phui-icon-view, | ||||
.jx-tokenizer-token.checkered .phui-icon-view, | |||||
.jx-tokenizer-token.checkered .jx-tokenizer-x { | |||||
color: {$sh-greyicon}; | color: {$sh-greyicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-checkered .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-checkered .phui-tag-core, | ||||
.jx-tokenizer-token.checkered:hover { | |||||
border-style: solid; | border-style: solid; | ||||
border-color: {$sh-greyborder}; | border-color: {$sh-greyborder}; | ||||
} | } | ||||
/* - Disabled --------------------------------------------------------------- */ | |||||
.phui-tag-shade-disabled .phui-tag-core { | .phui-tag-shade-disabled .phui-tag-core { | ||||
background-color: {$sh-disabledbackground}; | background-color: {$sh-disabledbackground}; | ||||
border-color: {$sh-lightdisabledborder}; | border-color: {$sh-lightdisabledborder}; | ||||
color: {$sh-disabledtext}; | color: {$sh-disabledtext}; | ||||
} | } | ||||
.phui-tag-shade-disabled .phui-icon-view { | .phui-tag-shade-disabled .phui-icon-view { | ||||
color: {$sh-disabledicon}; | color: {$sh-disabledicon}; | ||||
} | } | ||||
a.phui-tag-view:hover.phui-tag-shade-disabled .phui-tag-core { | a.phui-tag-view:hover.phui-tag-shade-disabled .phui-tag-core { | ||||
border-color: {$sh-disabledborder}; | border-color: {$sh-disabledborder}; | ||||
} | } | ||||
.phabricator-handle-tag-list-item + .phabricator-handle-tag-list-item { | |||||
margin-top: 4px; | |||||
} | |||||
.phui-object-item .phabricator-handle-tag-list { | |||||
display: inline; | |||||
} | |||||
.phui-object-item .phabricator-handle-tag-list-item { | |||||
display: inline; | |||||
margin: 0 4px 2px 0; | |||||
} |