<?xml version="1.0" encoding="UTF-8"?>

-<style title="UI.X Pro" export_version="2" base_version_id="2010470" user_selectable="1" description="The Ultimate Forum Experience">


-<templates>


-<template title="core_menu.less" version_string="2.1.1" version_id="2010170" addon_id="XF" type="public">

<![CDATA[// ###################################### MENUS ###################### @_menu-arrowSize: 8px; @_menu-edgePadding: @xf-pageEdgeSpacer; @_menu-closePaddingH: @xf-paddingLarge; @_menu-paddingH: 12px; @_menu-paddingV: 12px; .menuTrigger { cursor: pointer; &:after { .m-menuGadget(true); } } .menuOutsideClicker { position: fixed; display: none; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; // above non set stuff but below anything intentionally set &.is-active { display: block; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } } .menu { .m-transitionFade(); @media (max-width: @xf-responsiveNarrow) { width: 90% !important; max-width: 90% !important; left: 0; right: 0; margin-left: auto; margin-right: auto; } position: absolute; z-index: @zIndex-2; margin: @_menu-arrowSize 0 0; min-width: 240px; max-width: 320px; border-radius: @xf-menuBorderRadius; // .m-dropShadow(0, 5px, 10px, 0, .35); box-shadow: @xf-uix_elevation2; .xf-contentBase(); .block-container { box-shadow: none; // border-radius: 0; margin: 0; border: none; padding: 0; } &.menu--structural { margin-top: 0; // when menus nudge up against structure, the joined corner should not be radiused &.menu--left { // border-top-left-radius: 0; } &.menu--right { // border-top-right-radius: 0; } } &.menu--superWide { width: 75%; max-width: ~"calc(100% - @{xf-pageEdgeSpacer})"; } &.menu--veryWide { width: 500px; max-width: ~"calc(100% - @{xf-pageEdgeSpacer})"; } &.menu--wide { width: 350px; max-width: ~"calc(100% - @{xf-pageEdgeSpacer})"; } &.menu--medium { width: 300px; max-width: ~"calc(100% - @{xf-pageEdgeSpacer})"; } &.menu--potentialFixed { z-index: @zIndex-4; } .menu-minorHeader--small { padding: @_menu-paddingV @_menu-paddingH; font-size: calc(@xf-menu--font-size + 1); } } .menu-arrow { position: absolute; top: 0; width: 0; height: 0; border: 0 solid transparent; display: none; top: -@_menu-arrowSize; -ltr-rtl-left: 50%; -ltr-rtl-margin-left: -@_menu-arrowSize; .m-triangleUp(@xf-menuFeatureBorderColor, @_menu-arrowSize); .menu--structural & { top: -@_menu-arrowSize; } .menu--up & { display: none; } } .menu-content { margin: 0; padding: 0; list-style: none; text-align: left; .xf-menu(); border-radius: @xf-menuBorderRadius; // border-top: @xf-borderSizeFeature solid @xf-menuFeatureBorderColor; // when menus nudge up against structure, the joined corner should not be radiused .menu--structural.menu--left & { // border-top-left-radius: 0; } .menu--structural.menu--right & { // border-top-right-radius: 0; } // potentially fixed menus .menu--potentialFixed & { overflow: auto; max-height: 450px; max-height: 80vh; } > :last-child { border-bottom-left-radius: @xf-menuBorderRadius; border-bottom-right-radius: @xf-menuBorderRadius; } } .menu--pageJump { width: auto; min-width: 0; } .menu-header { padding: @_menu-paddingH; margin: 0; font-weight: @xf-fontWeightNormal; text-decoration: none; .xf-menuHeader(); .m-clearFix(); .m-hiddenLinks(); } .menu-tabHeader { padding: 0; margin: 0; font-weight: @xf-fontWeightNormal; text-decoration: none; .xf-menuTabHeader(); .m-tabsTogether(xf-default(@xf-menuTabHeader--font-size, @xf-fontSizeNormal)); .tabs-tab { padding: @xf-blockPaddingV @_menu-paddingH max(0px, @xf-blockPaddingV - @xf-borderSizeFeature); border-bottom: @xf-borderSizeFeature solid transparent; &:hover { color: @xf-blockMinorTabHeaderSelected--color; } &.is-active { .xf-menuTabHeaderSelected(); } } .hScroller-action { .m-hScrollerActionColorVariation( xf-default(@xf-menuTabHeader--background-color, transparent), xf-default(@xf-menuTabHeader--color, ~""), xf-default(@xf-blockMinorTabHeaderSelected--color, ~"") ); } } .menu-scroller { overflow: auto; max-height: 300px; max-height: 60vh; -webkit-overflow-scrolling: touch; .menu-row + & { border-top: @xf-borderSize solid @xf-borderColorLight; } } .menu-row { margin: 0; padding: @_menu-paddingH; .m-clearFix(); // causing issues when menu-row is not the first item // &:not(:first-of-type):not(.menu-row--separated) {padding-top: 0;} &.menu-row--alt { .xf-contentAltBase(); } &.menu-row--highlighted { .xf-contentHighlightBase(); } &.menu-row--close { padding-left: @_menu-closePaddingH; padding-right: @_menu-closePaddingH; } &.menu-row--separated { + .menu-row { border-top: @xf-borderSize solid @xf-borderColorLight; } } &.menu-row--clickable:hover { background: @xf-contentHighlightBg; } &:empty { padding: 0; } } .menu-linkRow { display: block; padding: @_menu-paddingV @_menu-paddingH; // text-indent: @_menu-paddingH; border-left: @xf-borderSizeFeature solid transparent; .xf-menuLinkRow(); &.menu-linkRow--alt { .xf-contentAltBase(); } &.is-selected, &:hover, &:focus { .xf-menuLinkRowSelected(); // border-left-color: fade(@xf-borderColorFeature, 50%); &:focus { outline: 0; } &.is-selected { border-left-color: @xf-borderColorFeature; } } i[aria-hidden=true] { font-size: @xf-fontSizeSmall; display: inline-block; width: 23px; // about 1.75em at this font size &:after { .m-faBase(); color: @xf-textColorMuted; left: @xf-blockPaddingH; } & ~ .menu-linkRow-hint { padding-left: 23px; } } &:hover i[aria-hidden=true]:after { color: @xf-linkHoverColor; } } .menu-linkRow-hint { font-style: inherit; font-size: @xf-fontSizeSmallest; color: @xf-textColorMuted; display: block; } .menu-separator { margin: 0 (@_menu-paddingH) / 2; padding: 0; border: none; border-top: @xf-borderSize solid @xf-borderColorLight; &.menu-separator--hard { margin: 0; } & + .menu-separator, &:last-child { display: none; } } .menu-footer { padding: @_menu-paddingV @_menu-paddingH; .xf-menuFooter(); .m-clearFix(); &.menu-footer--close { padding-left: @_menu-closePaddingH; padding-right: @_menu-closePaddingH; } &:not(.menu-footer--split) { .menu-footer-counter { float: left; } .menu-footer-controls { float: right; .button {.xf-uix_buttonSmall();} } } &.menu-footer--split { display: flex; align-items: center; .menu-footer-main, .menu-footer-counter { flex-grow: 1; } .menu-footer-select:not(:last-child) { margin: 0 1em; } .menu-footer-opposite, .menu-footer-controls { margin-left: auto; } } }]]>

</template>


-<template title="core_pagenav.less" version_string="2.1.0 Beta 5" version_id="2010035" addon_id="XF" type="public">

<![CDATA[// ####################################### PAGE NAVIGATION ######################## @_page-paddingV: xf-default(@xf-buttonBase--padding-top, 6px); @_page-paddingH: 8px; @_page-paddingHSimple: 10px; .pageNavWrapper {} .pageNav {display: flex;} .pageNav-jump--next {margin-left: 6px;} .pageNav-jump--prev {margin-right: 6px;} .m-pageNavElCore() { background: @xf-contentBg; color: @xf-textColorMuted; .xf-blockBorder(); // font-size: @xf-fontSizeSmall; border-radius: 0; border: 1px solid @xf-borderColor; white-space: nowrap; height: 24px; line-height: 24px; &:hover, &:active { // background: xf-intensify(@xf-contentHighlightBg, 3%); text-decoration: none; color: @xf-textColor; } } .pageNav-jump { display: inline-block; .m-pageNavElCore(); // border-radius: @xf-borderRadiusSmall; padding: @_page-paddingV @_page-paddingH; height: 26px; line-height: 26px; &.pageNav-jump--prev:before, &.pageNav-jump--next:after { .m-faBase('Pro', @faWeight-solid); font-size: 80%; unicode-bidi: isolate; // maintain position in RTL with LTR text } &.pageNav-jump--prev:before { .m-faContent("@{fa-var-caret-left}\00a0", 0.61em, ltr); .m-faContent("@{fa-var-caret-right}\00a0", 0.61em, rtl); <xf:macro template="uix_icons.less" name="content" arg-icon="menu-left" /> } &.pageNav-jump--next:after { .m-faContent("\00a0@{fa-var-caret-right}", 0.61em, ltr); .m-faContent("\00a0@{fa-var-caret-left}", 0.61em, rtl); <xf:macro template="uix_icons.less" name="content" arg-icon="menu-right" /> } } .pageNav-main { .m-listPlain(); display: inline-table; } .pageNav-page { display: table-cell; .m-pageNavElCore(); &:not(:last-child) { border-right: none; } &:not(:first-child) { border-left-color: @xf-borderColorLight; } <xf:comment> &:first-child { .m-borderLeftRadius(@xf-borderRadiusSmall); } &:last-child { .m-borderRightRadius(@xf-borderRadiusSmall); } </xf:comment> > a { display: block; padding: @_page-paddingV @_page-paddingH; text-decoration: none; color: inherit; } &.pageNav-page--current { // background: @xf-contentAccentBg; color: @xf-uix_secondaryColor; box-shadow: 0 -2px @xf-uix_secondaryColor inset; // border: @xf-borderSize solid @xf-borderColorAccentContent; cursor: pointer; &:hover, &:active { // background: xf-intensify(@xf-contentAccentBg, 3%); } <xf:comment> + .pageNav-page { border-left: none; } </xf:comment> } } // Hide relative page numbers on narrow devices when we have a skip entry as we don't necessarily have space. @media (max-width: @xf-responsiveNarrow) { .pageNav--skipStart { .pageNav-page.pageNav-page--earlier { display: none; } } .pageNav--skipEnd { .pageNav-page.pageNav-page--later { display: none; } .pageNav-page.pageNav-page--skipEnd { border-left: none; } } } // ########################### SIMPLE PAGE NAV VARIANT ######################## .pageNavSimple { display: inline-flex; height: 24px; line-height: 24px; } .pageNavSimple-el { display: inline-block; .xf-blockBorder(); border-radius: @xf-borderRadiusSmall; padding: @_page-paddingV @_page-paddingHSimple; font-size: @xf-fontSizeSmall; text-align: center; white-space: nowrap; margin-right: 4px; &:last-child { margin-right: 0; } &.pageNavSimple-el--current { // .xf-contentAccentBase(); color: @xf-uix_primaryColor; background-color: none; &:hover, &:active { background: xf-intensify(@xf-contentAccentBg, 3%); text-decoration: none; } } &.pageNavSimple-el--prev, &.pageNavSimple-el--next { background: @xf-uix_primaryColor; color: #fff; min-width: 75px; @media (max-width: 350px) { min-width: 0; } &:hover, &:active { background: xf-intensify(@xf-uix_primaryColor, 5%); text-decoration: none; } i:before { .m-faBase('Pro', @faWeight-solid); } } &.pageNavSimple-el--prev i:before { .m-faContent(@fa-var-caret-left, .44em, ltr); .m-faContent(@fa-var-caret-right, .44em, rtl); <xf:macro template="uix_icons.less" name="content" arg-icon="menu-left" /> } &.pageNavSimple-el--next i:before { .m-faContent(@fa-var-caret-right, .44em, ltr); .m-faContent(@fa-var-caret-left, .44em, rtl); <xf:macro template="uix_icons.less" name="content" arg-icon="menu-right" /> } &.pageNavSimple-el--first, &.pageNavSimple-el--last { border-color: transparent; padding-left: (@_page-paddingHSimple / 2); padding-right: (@_page-paddingHSimple / 2); color: @xf-uix_primaryColor; &:hover, &:active { .xf-blockBorder(); background: xf-intensify(@xf-contentHighlightBg, 3%); color: @xf-linkColor; text-decoration: none; } i:before { .m-faBase('Pro', @faWeight-solid); } } &.pageNavSimple-el--first i:before { .m-faContent(@fa-var-backward, 1em, ltr); .m-faContent(@fa-var-forward, 1em, rtl); <xf:macro template="uix_icons.less" name="content" arg-icon="arrow-left" /> width: auto; font-size: 18px; line-height: inherit; } &.pageNavSimple-el--last i:before { .m-faContent(@fa-var-forward, 1em, ltr); .m-faContent(@fa-var-backward, 1em, rtl); <xf:macro template="uix_icons.less" name="content" arg-icon="arrow-right" /> width: auto; font-size: 18px; line-height: inherit; } &.is-disabled { border-color: transparent; background: none; color: @xf-textColorMuted; text-decoration: none; pointer-events: none; &:hover { background: none; color: @xf-textColorMuted; } } } // #################### DISPLAY VARIANTS ######################### .pageNavWrapper--simple { .pageNav { display: none; } } .pageNavWrapper--full { .pageNavSimple { display: none; } } .pageNavWrapper--mixed { .pageNavSimple { display: none; } @media (max-width: @xf-responsiveMedium) { .pageNav { display: none; } .pageNavSimple { display: inline-flex; } } } <xf:if is="property('uix_hideTopPagenavMobile')"> // Hide any block page nav that goes before the block as we will be wasting vertical space. @media (max-width: @xf-responsiveNarrow) { .block-outer:not(.block-outer--after) .pageNavWrapper:not(.pageNavWrapper--forceShow) { display: none; } // this is a sanity check in case .block-outer--after is forgotten .block-container + .block-outer .pageNavWrapper { display: block; } } </xf:if>]]>

</template>


-<template title="message.less" version_string="2.1.3" version_id="2010370" addon_id="XF" type="public">

<![CDATA[@_message-actionColumnWidth: 40px; @_messageSimple-userColumnWidth: 70px; .message { + .message, &.message--bordered { border-top: @xf-borderSize solid @xf-borderColor; } } .message, .block--messages .message { &.is-mod-selected { background: @xf-inlineModHighlightColor; .message-cell--user { background: @xf-inlineModHighlightColor; } .message-userArrow:after { border-right-color: @xf-inlineModHighlightColor; } } } .message-inner { display: flex; } .message-cell { display: block; vertical-align: top; padding: @xf-messagePadding; .message--quickReply & { //padding-bottom: 35px; // for the submit row > .formRow:last-child { > dd { padding-bottom: 0; } } } &.message-cell--closer { padding: @xf-messagePaddingSmall; &.message-cell--user { .m-fixedWidthFlex((@xf-messageUserBlockWidth) + 2 * (@xf-messagePaddingSmall)); .message--simple & { .m-fixedWidthFlex(@_messageSimple-userColumnWidth + 2 * (@xf-messagePaddingSmall)); } } &.message-cell--action { .m-fixedWidthFlex((@_message-actionColumnWidth) + 2 * (@xf-messagePaddingSmall)); } } &.message-cell--user, &.message-cell--action { position: relative; .xf-messageUserBlock(no-border); border-right: @xf-messageUserBlock--border-width solid @xf-messageUserBlock--border-color; min-width: 0; } &.message-cell--user { .m-fixedWidthFlex((@xf-messageUserBlockWidth) + 2 * (@xf-messagePadding)); .message--simple & { .m-fixedWidthFlex(@_messageSimple-userColumnWidth + 2 * @xf-messagePaddingSmall); // width: auto; // min-width: auto; // background: none; // border: none; padding-right: 0; } } &.message-cell--action { .m-fixedWidthFlex((@_message-actionColumnWidth) + 2 * (@xf-messagePadding)); } &.message-cell--main { flex: 1 1 auto; width: 100%; // display: flex; min-width: 0; .xf-uix_messageMain(); &.is-editing { padding: 0; } .block { margin: 0; } .block-container { margin: 0; border: none; } } &.message-cell--alert { font-size: @xf-fontSizeSmall; flex: 1 1 auto; width: 100%; min-width: 0; .xf-contentAccentBase(); a { .xf-contentAccentLink(); } } &.message-cell--extra { .m-fixedWidthFlex(180 + 2 * (@xf-messagePadding)); border-left: @xf-messageUserBlock--border-width solid @xf-messageUserBlock--border-color; background: @xf-contentAltBg; .formRow-explain { margin: @xf-paddingMedium 0 0; .xf-formExplain(); .m-textColoredLinks(); font-size: 80%; } } } .message-main { height: 100%; display: flex; flex-direction: column; width: 100%; min-width: 0; } .message-content { flex: 1 1 auto; // IE11 flex bug min-height: 1px; max-width: 100%; } .message-footer { margin-top: auto; } form.message--simple .message-cell--main { flex-direction: column; padding: @xf-paddingLarge; } .message--quickReply .message-cell--main { flex-direction: column; padding: @xf-messagePadding; } @media (max-width: @xf-messageSingleColumnWidth) { .message:not(.message--forceColumns) { .message-inner { display: block; } .message-cell { display: block; .m-clearFix(); &.message-cell--user { width: auto; border-right: none; border-bottom: @xf-messageUserBlock--border-width solid @xf-messageUserBlock--border-color; } &.message-cell--main { // padding-left: @xf-messagePadding; } &.message-cell--extra { width: auto; border-left: none; border-top: @xf-messageUserBlock--border-width solid @xf-messageUserBlock--border-color; } } } .message--simple:not(.message--forceColumns), .message--quickReply:not(.message--forceColumns) { .message-cell.message-cell--user { display: none; } } } // ######################## USER COLUMN ######################### .message-userArrow { position: absolute; top: (@xf-messagePadding) * 2; right: -1px; .m-triangleLeft(xf-default(@xf-messageUserBlock--border-color, transparent), @xf-messagePadding); <xf:if is="property('uix_removeMessageArrow')"> display: none; </xf:if> &:after { position: absolute; top: -(@xf-messagePadding - 1px); right: -@xf-messagePadding; content: ""; <xf:if is="property('uix_messageMain--background-color')"> .m-triangleLeft(@xf-uix_messageMain--background-color, @xf-messagePadding - 1px); <xf:else /> .m-triangleLeft(xf-default(@xf-contentBg, transparent), @xf-messagePadding - 1px); </xf:if> } } .message-avatar { text-align: center; .avatar { vertical-align: bottom; max-width: @xf-messageUserBlockWidth; max-height: @xf-messageUserBlockWidth; } } .message-avatar-wrapper { position: relative; display: inline-block; vertical-align: bottom; margin-bottom: .5em; .message-avatar-online { position: absolute; // center bottom position left: 50%; margin-left: -.615em; bottom: -.5em; &:before { .m-faBase(); .m-faContent(@fa-var-user-circle); line-height: 1; font-weight: bold; color: rgb(127, 185, 0); background: @xf-contentBg; border: @xf-contentBg solid 2px; background: @xf-uix_message--background-color; border-color: @xf-uix_message--background-color; background: @xf-messageUserBlock--background-color; border-color: @xf-messageUserBlock--background-color; border-radius: 50%; display: inline-block; } } } .message-name { font-weight: @xf-fontWeightHeavy; font-size: inherit; text-align: center; margin: 0; } .message-userTitle { font-size: @xf-fontSizeSmaller; font-weight: normal; text-align: center; margin: 0; } .message-userBanner.userBanner { @media (min-width: @xf-messageSingleColumnWidth) { display: block; } margin-top: 3px; } .message-userExtras { // margin-top: 3px; font-size: @xf-fontSizeSmaller; <xf:if is="property('uix_postBitIcons')"> dl.pairs dt:after {content:'';} .pairs { display: flex; align-items: center; i {font-size: 18px;} dd { min-width: 0; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; } } </xf:if> } .message--deleted { .message-userDetails { display: none; } .message-avatar .avatar { .m-avatarSize(@avatar-s); } } @media (min-width: @xf-messageSingleColumnWidth) { .message-userDetails {text-align: center;} } @media (max-width: @xf-messageSingleColumnWidth) { .uix_messagePostBitWrapper { display: flex; flex-grow: 1; flex-direction: column; min-width: 0; max-width: 100%; } .message:not(.message--forceColumns) { .message-userArrow { top: auto; right: auto; bottom: -1px; left: ((@avatar-s) / 2); border: none; .m-triangleUp(xf-default(@xf-messageUserBlock--border-color, transparent), @xf-messagePadding); &:after { top: auto; right: auto; left: -(@xf-messagePadding - 1px); bottom: -@xf-messagePadding; border: none; .m-triangleUp(@xf-contentBg, @xf-messagePadding - 1px); } } &.is-mod-selected { .message-userArrow:after { border-color: transparent; border-bottom-color: @xf-inlineModHighlightColor; } } .message-user { display: flex; } .message-avatar { margin-bottom: 0; .avatar { .m-avatarSize(@avatar-s); & + .message-avatar-online { left: auto; right: 0; } } } .message-userDetails { flex: 1; min-width: 0; padding-left: @xf-messagePadding; width: 100%; } .message-userExtras { display: flex; flex-wrap: wrap; align-items: center; padding-left: @xf-messagePadding; padding-top: @xf-paddingSmall; .pairs { margin-right: @xf-paddingMedium; line-height: 1.3; } } .message-name { text-align: left; } .message-userTitle, .message-userBanner.userBanner { display: inline-block; text-align: left; margin: 0; } .message--deleted { .message-userDetails { display: block; } } } } // ####################### MAIN COLUMN #################### .message-content { position: relative; .js-selectToQuoteEnd { height: 0; font-size: 0; overflow: hidden; } .message--multiQuoteList & { min-height: 80px; max-height: 120px; overflow: hidden; .message-body { pointer-events: none; } } } .message-attribution { color: @xf-textColorMuted; font-size: @xf-fontSizeSmaller; border-bottom: @xf-borderSize solid @xf-borderColorFaint; padding-bottom: 3px; // .m-clearFix(); .xf-uix_messageMeta; &.message-attribution--plain { border-bottom: none; font-size: inherit; // padding-bottom: 0; } &.message-attribution--split { display: flex; align-items: flex-end; .message-attribution-opposite { margin-left: auto; } } } .message-attribution-main { float: left; } .message-attribution-opposite { float: right; &.message-attribution-opposite--list { display: flex; .m-listPlain(); > li { margin-left: 14px; &:first-child { margin-left: 0; } } a { display: inline-block; margin: -3px -7px; padding: 3px 7px; } } a { color: inherit; &:hover { text-decoration: none; color: @xf-linkHoverColor; } } } .message-attribution-source { font-size: @xf-fontSizeSmaller; margin-bottom: @xf-paddingSmall; } .message-attribution-user { font-weight: @xf-fontWeightHeavy; .avatar { display: none; } .attribution { display: inline; font-size: inherit; font-weight: inherit; margin: 0; } } .message-newIndicator { .xf-messageNewIndicator(); } .message-minorHighlight { font-size: @xf-fontSizeSmall; color: @xf-textColorFeature; padding-left: @xf-messagePadding; padding-right: @xf-messagePadding; } .message-fields { margin: @xf-messagePadding 0; .xf-uix_threadField(); dt, dd {vertical-align: top;} .pairs dd {display: inline-block;} } .message-body { margin: @xf-messagePadding 0; font-family: @xf-fontFamilyBody; .m-clearFix(); .xf-uix_messageBody(); .message--simple & { // margin-top: @xf-messagePaddingSmall; margin-bottom: @xf-messagePaddingSmall; } &:last-child { margin-bottom: 0; } .message-title { // basically replicates .structItem-title font-size: @xf-fontSizeLarge; font-weight: @xf-fontWeightNormal; margin: 0 0 @xf-messagePadding 0; padding: 0; } } .message-attachments { margin: .5em 0; .xf-uix_messageAttachments(); } .message-attachments-list { .m-listPlain(); } .message-lastEdit { margin-top: .5em; color: @xf-textColorMuted; font-size: @xf-fontSizeSmallest; text-align: right; padding: 0 @xf-messagePadding @xf-messagePadding; } .message-signature { margin-top: @xf-messagePadding; .xf-messageSignature(); } .message-actionBar .actionBar-set { // margin-top: @xf-messagePadding; font-size: @xf-fontSizeSmall; // padding: calc( @xf-messagePadding / 2 ); .message--simple & { // margin-top: @xf-messagePaddingSmall; } } .message .likesBar { // .xf-minorBlockContent(); // font-size: @xf-fontSizeSmaller; margin-top: @xf-messagePadding; padding: @xf-messagePaddingSmall; .xf-uix_messageLikes(); } .message .reactionsBar { margin-top: @xf-messagePadding; padding: @xf-messagePaddingSmall; .xf-uix_messageLikes(); } .message-historyTarget { margin-top: @xf-messagePadding; } .message-gradient { position: absolute; bottom: 0; left: 0; right: 0; height: 60px; .m-gradient(fade(@xf-contentBg, 0%), @xf-contentBg, @xf-contentBg, 0%, 90%); } .message-responses { margin-top: @xf-messagePaddingSmall; font-size: @xf-fontSizeSmall; .editorPlaceholder { .input { font-size: inherit; } } } .message-responseRow { margin-top: -@xf-minorBlockContent--border-width; .xf-minorBlockContent(); padding: @xf-messagePadding; // note that border radiuses are very difficult to do here due to a lot of dynamic showing/hiding &.message-responseRow--likes, &.message-responseRow--reactions { .m-transitionFadeDown(); } } @media (max-width: @xf-messageSingleColumnWidth) { .message:not(.message--forceColumns) { .message-attribution-user .avatar { display: inline-flex; .m-avatarSize((@xf-fontSizeNormal) * (@xf-lineHeightDefault)); } .message-content { // this is 1px to workaround an IE11 issue - see #139187 min-height: 1px; } } } @media (max-width: @xf-responsiveNarrow) { .message-signature { display: none; } } // MESSAGE MENU .message-menuGroup { display: inline-block; } .message-menuTrigger { display: inline-block; &:after { .m-menuGadget(); // 1em text-align: right; } &:hover:after { color: black; } } .message-menu-section { &--editDelete { .menu-linkRow { font-weight: @xf-fontWeightHeavy; font-size: @xf-fontSizeNormal; } } } .message-menu-link { &--delete i:after { .m-faContent(@fa-var-trash-alt); } &--edit i:after { .m-faContent(@fa-var-edit); } &--report i:after { .m-faContent(@fa-var-frown); } &--warn i:after { .m-faContent(@fa-var-exclamation-triangle); } &--spam i:after { .m-faContent(@fa-var-ban); } &--ip i:after { .m-faContent(@fa-var-sitemap); } &--history i:after { .m-faContent(@fa-var-history); } &--follow i:after { .m-faContent(@fa-var-user-plus); } &--ignore i:after { .m-faContent(@fa-var-user-times); } &--share i:after { .m-faContent(@fa-var-share-alt); } } // ############################# COMMENTS ############### .comment { } .comment-inner { display: table; table-layout: fixed; width: 100%; } .comment-avatar { display: table-cell; width: 24px; vertical-align: top; .avatar, img { vertical-align: bottom; } } .comment-main { display: table-cell; padding-left: @xf-messagePadding; vertical-align: top; } .comment-contentWrapper { margin-bottom: @xf-messagePaddingSmall; } .message-responses .comment-actionBar.actionBar {padding: 0;} .message-responses .comment-actionBar .actionBar-set.actionBar-set--internal {padding: 0;} .comment-user { font-weight: @xf-fontWeightHeavy; } .comment-body { display: inline; } .comment-input { display: block; height: 2.34em; margin-bottom: @xf-messagePaddingSmall; } .comment-actionBar .actionBar-set { // margin-top: @xf-messagePaddingSmall; color: @xf-textColorMuted; } .comment-likes, .comment-reactions { .m-transitionFadeDown(); margin-top: @xf-messagePaddingSmall; font-size: @xf-fontSizeSmaller; } // ######################### ACTION BAR ####################### .actionBar { .m-clearFix(); .xf-uix_messageActionBar(); } .actionBar-set { &.actionBar-set--internal { float: left; margin-left: -3px; > .actionBar-action:first-child { margin-left: 0; } } &.actionBar-set--external { float: right; margin-right: -3px; > .actionBar-action:last-child { margin-right: 0; } } } // ################################## MESSAGE QUICK REPLY ADDITIONS ############# .formSubmitRow.formSubmitRow--messageQr { .formSubmitRow-controls { text-align: center; padding-left: 0; padding-right: 0; margin-left: @xf-messagePadding; margin-right: @xf-messagePadding; @media (max-width: @xf-formResponsive) { text-align: right; } .menu & {text-align: right;} } } // ################################## MESSAGE NOTICES ############################# .messageNotice { margin: @xf-messagePaddingSmall 0; padding: @xf-messagePaddingSmall @xf-messagePadding; .xf-contentAccentBase(); font-size: @xf-fontSizeSmaller; border-left: @xf-borderSizeMinorFeature solid @xf-borderColorAttention; .xf-uix_messageNotice(); &.messageNotice--nested { border-left-width: @xf-borderSize; } &:not(.messageNotice--highlighted) { a, a:hover { .xf-contentAccentLink(); } } &:before { display: inline-block; .m-faBase(); padding-right: .2em; font-size: 125%; color: @xf-textColorAttention; vertical-align: middle; font-size: @xf-uix_iconSize !important; } &.messageNotice--highlighted { .xf-contentHighlightBase(); border-left-color: @xf-borderColorFeature; &:before { color: @xf-textColorFeature; } } &.messageNotice--deleted:before { .m-faContent(@fa-var-trash-alt, .79em); <xf:macro template="uix_icons.less" name="content" arg-icon="delete" />} &.messageNotice--moderated:before { .m-faContent(@fa-var-shield, .72em); <xf:macro template="uix_icons.less" name="content" arg-icon="moderate" />} &.messageNotice--warning:before { .m-faContent(fa-var-exclamation-triangle, 1em); <xf:macro template="uix_icons.less" name="content" arg-icon="warning" />} &.messageNotice--ignored:before { .m-faContent(@fa-var-microphone-slash, .79em); <xf:macro template="uix_icons.less" name="content" arg-icon="ignored" />} } // ##################### MESSAGE VARIANTS/RESPONSIVE ################## @media (min-width: @xf-responsiveEdgeSpacerRemoval) { .block:not(.block--messages) { @{block-noStripSel} > .block-body:first-child > .message:first-child, .block-topRadiusContent.message, .block-topRadiusContent > .message:first-child { .message-cell:first-child { border-top-left-radius: @block-borderRadius-inner; } .message-cell:last-child { border-top-right-radius: @block-borderRadius-inner; } } @{block-noStripSel} > .block-body:last-child > .message:last-child, .block-bottomRadiusContent.message, .block-bottomRadiusContent > .message:last-child { .message-cell:first-child { border-bottom-left-radius: @block-borderRadius-inner; } .message-cell:last-child { border-bottom-right-radius: @block-borderRadius-inner; } } } } .block--messages, .js-quickReply { .block-container { background: none; border: none; box-shadow: none; border-radius: 0; overflow: visible; padding: 0; } .message, .block-row { .xf-contentBase(); .xf-blockBorder(); border-radius: @xf-blockBorderRadius; .xf-uix_message(); &:first-child { border-top-left-radius: @xf-borderRadiusLarge; border-top-right-radius: @xf-borderRadiusLarge; } &:last-child { border-bottom-left-radius: @xf-borderRadiusLarge; border-bottom-right-radius: @xf-borderRadiusLarge; } + .message, + .block-row { margin-top: @xf-blockPaddingV; // Changed for iO margin-top:0; } } .message-spacer { + .message, + .block-row { margin-top: @xf-blockPaddingV; } } .message-cell { &:first-child { border-radius: 0; border-top-left-radius: @block-borderRadius-inner; border-bottom-left-radius: @block-borderRadius-inner; } &:last-child { border-radius: 0; border-top-right-radius: @block-borderRadius-inner; border-bottom-right-radius: @block-borderRadius-inner; } &:first-child:last-child { border-radius: @block-borderRadius-inner; } } @media (max-width: @xf-messageSingleColumnWidth) { .message:not(.message--forceColumns) { .message-cell { &:first-child { border-radius: 0; border-top-left-radius: @block-borderRadius-inner; border-top-right-radius: @block-borderRadius-inner; } &:last-child { border-radius: 0; border-bottom-left-radius: @block-borderRadius-inner; border-bottom-right-radius: @block-borderRadius-inner; } &:first-child:last-child { border-radius: @block-borderRadius-inner; } } } .message--simple:not(.message--forceColumns) .message-cell--user + .message-cell { border-radius: 0; border-top-left-radius: @block-borderRadius-inner; border-top-right-radius: @block-borderRadius-inner; } } @media (max-width: @xf-responsiveEdgeSpacerRemoval) { .message, .block-row { border-left: none; border-right: none; border-radius: 0; } .message-cell { border-radius: 0; &:first-child, &:last-child { border-radius: 0; } } .message--simple .message-cell--user + .message-cell { border-radius: 0; } .message-container { padding: @xf-paddingMedium 0 0 0; .message-container-header { text-align: center; } .message { border-bottom: 0; } } } }]]>

</template>


-<template title="uix.less" version_string="" version_id="0" addon_id="" type="public">

<![CDATA[{{ include('uix_icons.less') }} {{ include('uix_buttonRipple.less') }} {{ include('uix_pageAnimations.less') }} {{ include('uix_canvas.less') }} {{ include('uix_thirdParty.less') }} {{ include('uix_bandaids.less') }} <xf:if is="property('uix_onlineIndicator') == 'pulse'"> @keyframes pulse { from { opacity: 1; border-width: 0px; transform: scale(1); } to { transform: scale(2); opacity: 0; border-width: 8px; } } .message-avatar-online { display: inline-flex; align-items: center; justify-content: center; &:after { content: ''; position: absolute; height: 100%; width: 100%; border-radius: 100%; border: 1px solid rgb(127, 185, 0); height: 13px; width: 13px; opacity: 1; animation: pulse 1.5s; animation-iteration-count: infinite; animation-timing-function: ease; transform-origin: center; } } </xf:if> .fb-page { width: 100%; } .tabPanes .block-outer {padding-top: @xf-elementSpacer;} .uix_node--transitioning { .m-uix_collapseOverflow(); } .message .message-responses { .message-responseRow { &:first-child, &.is-active { margin-top: @xf-messagePaddingSmall; } } .comment .comment-actionBar.actionBar { // padding: @xf-messagePadding 0 0; margin: 0; } } .p-nav-menuTrigger { position: relative; &.badgeContainer:after { position: absolute; left: -5px; top: -5px; @media (min-width: @xf-responsiveNarrow) { display: none !important; } } } .menu-footer-controls { display: flex; flex-wrap: wrap; .button:not(:last-child) { margin-right: 5px; } } .p-navEl .menu-linkRow:before {margin-right: @xf-paddingSmall; } <xf:if is="property('uix_sidebarMobileCanvas')"> @media (min-width: @xf-uix_sidebarBreakpoint) { .uix_sidebarCanvasTrigger {display: none;} } @media (max-width: @xf-uix_sidebarBreakpoint) { body .p-body-sidebar { position: fixed; top: 0; left: 0; bottom: 0; right: 0; transform: translatex(-100%); margin: 0; &.is-transitioning { transition: ease-in .25s .25s transform; .uix_sidebarInner {transition: transform 0.25s ease-in;} &.is-active {transition: ease-in .01s transform;} } .uix_sidebarInner { padding: 0; margin: 0; <xf:if is="{{ property('uix_sidebarLocation') }} == 'right'"> transform: translatex(200%); margin-left: auto; <xf:else /> transform: translatex(-100%); </xf:if> } .block-container {box-shadow: none;} .uix_sidebar--scroller {margin: 0;} &.is-active { transform: translatex(0); .uix_sidebarInner.offCanvasMenu-content { transform: translatex(0); } } } } <xf:else /> @media (max-width: @xf-uix_sidebarBreakpoint) { body .uix_sidebarInner .uix_sidebar--scroller {margin-top: 0;} } </xf:if> // added to vertically center discussion list meta info .structItem-cell--main .structItem-minor { display: flex; align-items: center; .structItem-parts {flex-grow: 1;} .structItem-extraInfo {order: 2; margin-left: auto;} .structItem-statuses {order: 1;} } // end .uix_threadRepliesMobile { .pairs.pairs--justified > dt {margin-right: 2px;} dt:after {display: none;} } .uix_headerContainer .uix_mainTabBar { display: flex; justify-content: center; .xf-uix_mainTabsBarStyling(); .block-tabHeader {border: none;} .tabs-tab:hover {background: none;} } .offCanvasMenu-content {min-height: 100vh;} .offCanvasMenu-content .p-body-sideNavContent { .block {margin: 0;} .block-container { box-shadow: none; } } .p-body-header .uix_sidebarTrigger__component {margin-left: @xf-paddingMedium;} .cover .memberHeader-blurb.pairs { border-color: rgba(255,255,255,.3); } .hScroller-scroll { &.th_scroller--start-active { -webkit-mask-image: linear-gradient(to right, transparent 3%, black 10%); mask-image: linear-gradient(to right, transparent 3%, black 10%); } &.th_scroller--end-active { -webkit-mask-image: linear-gradient(to left, transparent 3%, black 10%); mask-image: linear-gradient(to left, transparent 3%, black 10%); } &.th_scroller--end-active.th_scroller--start-active { -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0) 3%,rgba(0,0,0,1) 10%,rgba(0,0,0,1) 90%,rgba(0,0,0,0) 97%); mask-image: linear-gradient(to right, rgba(0,0,0,0) 3%,rgba(0,0,0,1) 10%,rgba(0,0,0,1) 90%,rgba(0,0,0,0) 97%); } } .block[data-widget-definition="visitor_panel"] .contentRow {margin-bottom: @xf-paddingMedium;} .block[data-widget-definition="th_widget_login_uix"] .formSubmitRow-controls { padding-left: 0; text-align: center; } .uix_loginProvider__row { dt {display: none;} dd {text-align: center;} } .thBranding__pipe {display: none;} .p-footer-copyright > * ~ .thBranding .thBranding__pipe {display: inline;} .offCanvasMenu-link {padding: @xf-paddingMedium @xf-paddingLarge;} .offCanvasMenu-subList {padding-bottom: 0;} *::selection, { .xf-uix_textSelection(); /* WebKit/Blink Browsers */ } *::-moz-selection { .xf-uix_textSelection(); /* Gecko Browsers */ } .block-container { .uix_newIndicator { .xf-uix_newNodeMarkerStyle(); } } /* --- Sticky kit header fix --- */ .uix_headerContainer--stickyFix { height: 1px; visibility: hidden; } .uix_headerContainer {margin-top: -1px !important;} /* -- fixes sticky kit abs positioning for sticky header on covered themes -- */ <xf:if is="{{ property('uix_pageStyle') }} == 'covered'"> .has-no-hiddenscroll .is-modalOpen .is-sticky { margin-left: 0px; } </xf:if> .uix_adminTrigger {display: none !important;} <xf:if is="property('uix_collapseStaffbarLinks')"> @media (max-width: @xf-uix_viewportCollapseStaffLinks) { .p-staffBar-link {display: none !important;} .uix_adminTrigger {display: inline-block !important;} } </xf:if> /***** Abridged Signatures *******/ .uix_signatureExpand {display: none;} .message-signature { overflow: hidden; transition: ease-in-out .2s height; &--expandable { height: @xf-uix_signatureMaxHeight + 0px; // adding 0 converts the number to px value} <xf:if is="property('messageSignature--background-color')"> @signatureBgColor: @xf-messageSignature--background-color; <xf:elseif is="property('uix_message--background-color')" /> @signatureBgColor: @xf-uix_message--background-color; <xf:elseif is="property('contentBase--background-color')" /> @signatureBgColor: @xf-contentBase--background-color; <xf:else /> @signatureBgColor: @xf-contentBg; </xf:if> .uix_signatureExpand { padding-bottom: @xf-paddingLarge; background: linear-gradient(to bottom, fade(@signatureBgColor, 0%), @signatureBgColor 40%); text-align: center; display: flex; justify-content: center; align-items: flex-end; height: 60px; position: absolute; bottom: 0; left: 0; right: 0; color: @xf-textColorAttention; &:hover {cursor: pointer;} } } &.message-signature--expanded { height: auto; padding-bottom: @xf-paddingLarge; .bbWrapper {padding-bottom: (@xf-paddingLarge * 2);} .uix_signatureExpand {background: none;} } } /***** extra user info postbit collapse *******/ <xf:if is="property('uix_collapseExtraInfo')"> .thThreads__userExtra--toggle { text-align: center; margin-top: @xf-paddingMedium; .thThreads__userExtra--trigger { transition: ease-in transform .2s .2s; display: inline-block; &:hover {cursor: pointer;} &:before { .m-faBase(); .m-faContent(@fa-var-chevron-down); } } } </xf:if> .thThreads__message-userExtras { height: 0; overflow: hidden; transition: ease-in height .2s; } @media (max-width: @xf-messageSingleColumnWidth) { .thThreads__message-userExtras {display: none;} .thThreads__userExtra--toggle {display: none;} } .userExtra--expand { .thThreads__message-userExtras {height: auto;} .thThreads__userExtra--trigger {transform: rotate(-180deg);} } /*------- sticky thread collapse ------- */ <xf:if is="property('uix_collapsibleStickyThreads')"> .uix_threadCollapseTrigger { transition: ease transform .2s; margin-left: auto; font-size: 18px; &.is-active {transform: rotate(-180deg);} } .uix_stickyContainerOuter { transition: ease-in height 0.3s, ease-in opacity 0.3s; opacity: 1; display: none; opacity: 0; -webkit-transition: all 0.2s ease, -xf-opacity 0.2s ease; transition: all 0.2s ease, -xf-opacity 0.2s ease; overflow-y: hidden; height: 0; -webkit-transition-property: all, -xf-height; transition-property: all, -xf-height; &.is-active { display: block; opacity: 1; height: auto; overflow-y: visible; } &.is-transitioning { display: block; width: 100%; } &.is-transitioning { overflow-y: hidden; } .uix_stickyContainerInner { width: 100%; display: table; } } .uix_stickyContainerOuter.uix_threadListSeparator--collapsed { height: 0; opacity: 0; pointer-events: none; transition: ease-in height 0.3s, ease-in opacity 0.3s; .uix_block-body--outer { height: 0 !important; opacity: 0; pointer-events: none; } } </xf:if> /*------- category collapse ------- */ <xf:if is="property('uix_categoryCollapse')"> @keyframes overflow { from { overflow: visible; } to { overflow: hidden; } } .category--collapsed.block--category { .uix_block-body--outer { height: 0 !important; opacity: 0; pointer-events: none; animation: overflow; animation-delay: .3s; aniamtion-fill-mode: backwards; } .categoryCollapse--trigger {transform: rotate(-180deg);} &:hover {text-decoration: none;} } .categoryCollapse--trigger { transition: @uix_move transform .2s; overflow: hidden; height: 18px; min-width: 24px; width: 24px; display: inline-flex; align-items: center; justify-content: center; text-decoration: none !important; } .block--category .uix_block-body--outer { transition: @uix_move height 0.3s, @uix_move opacity 0.3s; opacity: 1; } </xf:if> /*------- Sidebar collapse ------- */ a.uix_sidebarTrigger__component { display: inline-flex; align-items: center; &:hover {cursor: pointer;} <xf:if is="property('uix_viewportWidthRemoveSubNav') != '100%'"> <xf:if is="property('uix_sidebarTriggerPosition') == 'sectionLinks'"> @media (min-width: {{ property('uix_viewportWidthRemoveSubNav') + 1}}px) { .p-nav-inner & {display: none !important;} } </xf:if> </xf:if> <xf:if is="property('uix_sidebarTriggerPosition') == 'titlebar'"> @media (min-width: {{ property('responsiveWide') + 1}}px) { .p-nav-inner & {display: none !important;} } @media (max-width: @xf-responsiveWide) { .p-body-header & {display: none !important;} } </xf:if> .p-nav-inner & { color: inherit; color: @xf-publicNavTab--color; background: none !important; box-shadow: none; border: none; .uix_sidebarTrigger--phrase { display: none; } i { font-size: @xf-uix_iconSizeLarge; width: auto; padding: 0; margin: 0; &:before { display: inline-flex; justify-content: center; width: 10px; } } } &.uix_sidebarCanvasTrigger { @media (min-width: {{ property('uix_sidebarBreakpoint') + 1}}px) { display: none; } } &.uix_sidebarTrigger { @media (max-width: @xf-uix_sidebarBreakpoint) { display: none; } } i { // transform: rotate(0); // transition: ease-in transform .2s; font-size: @xf-uix_iconSize; margin-left: -7px; } <xf:if is="property('uix_sidebarLocation') == 'left'"> span {order: 1;} /* i { transform: rotate(-180deg); .uix_sidebarCollapsed & { transform: rotate(0); } } */ </xf:if> } <xf:if is="property('uix_collapsibleSidebar')"> .p-body-sidebar { transition: ease-in width .2s, ease-in opacity .2s .3s, ease-in height .2s; opacity: 1; max-height: 100%; * {transition: ease-in font-size .01s;} } @media (min-width: @xf-responsiveWide) { .uix_sidebarCollapsed { .p-body-sidebar { transition: ease-in width 0.2s 0.2s, ease-in opacity 0.2s, ease-in height .2s .2s; width: 0; opacity: 0; height: 0; } .p-body-main--withSidebar .p-body-content { width: 100%; max-width: 100%; <xf:if is="{{ property('uix_sidebarLocation') == 'left' }}"> transition: ease-in width 0.2s 0.2s, ease-in max-width 0.2s .2s </xf:if> } .p-body-main--withSidebar.p-body-main--withSideNav .p-body-content { width: calc(~"100% - {{ property('sidebarWidth') + property('elementSpacer')}}px"); max-width: calc(~"100% - {{ property('sidebarWidth') + property('elementSpacer')}}px"); <xf:if is="{{ property('uix_sidebarLocation') == 'left' }}"> transition: ease-in width 0.2s 0.2s, ease-in max-width 0.2s .2s </xf:if> } } } </xf:if> <xf:if is="property('uix_sidebarLeft')"> .button.uix_sidebarTrigger__component { flex-direction: row-reverse; } </xf:if> /*------- navigation icons------- */ body .p-navEl-link, body .offCanvasMenu-link { font-family: inherit; font-weight: inherit; -webkit-font-smoothing: initial; } <xf:if is="property('uix_navTabIcons')"> .p-navEl-link:before, .offCanvasMenu-link:before { .m-faBase(); .xf-uix_navTabIconStyle(); } <xf:if is="!property('uix_navTabIcons')"> .p-navEl-link:before {display: none !important;} </xf:if> .p-navEl-link:not(.mdi):not(.fa), .offCanvasMenu-link:not(.mdi):not(.fa) { <xf:if is="{{ property('uix_iconFontFamily') }} == 'fontawesome'"> &[data-nav-id]:before {.m-faBase();} </xf:if> <xf:if is="{{ property('uix_defaultNavIcon') }}"> &[data-nav-id]:before { .m-faContent(@fa-var-folder); <xf:macro name="content" template="uix_icons.less" arg-icon="folder" /> } </xf:if> .offCanvasMenu-link {dislay: none;} &[data-nav-id="thxpress"]:before { .m-faContent(@fa-var-newspaper); <xf:macro name="content" template="uix_icons.less" arg-icon="\f332" /> } &[data-nav-id="th_donate"]:before { .m-faContent(@fa-var-gift); <xf:macro name="content" template="uix_icons.less" arg-icon="\f2a1" /> } &[data-nav-id="home"]:before { .m-faContent(@fa-var-home); <xf:macro name="content" template="uix_icons.less" arg-icon="home" /> } &[data-nav-id="forums"]:before { .m-faContent(@fa-var-comments); <xf:macro name="content" template="uix_icons.less" arg-icon="forum" /> } &[data-nav-id="whatsNew"]:before { .m-faContent(@fa-var-bolt); <xf:macro name="content" template="uix_icons.less" arg-icon="whats-new" /> } &[data-nav-id="members"]:before { .m-faContent(@fa-var-users); <xf:macro name="content" template="uix_icons.less" arg-icon="user-multiple" /> } &[data-nav-id="profile"]:before { .m-faContent(@fa-var-user); <xf:macro name="content" template="uix_icons.less" arg-icon="user" /> } &[data-nav-id="alerts"]:before { .m-faContent(@fa-var-bell); <xf:macro name="content" template="uix_icons.less" arg-icon="alert" /> } &[data-nav-id="settings"]:before { .m-faContent(@fa-var-cog); <xf:macro name="content" template="uix_icons.less" arg-icon="settings" /> } &[data-nav-id="xfmg"]:before { .m-faContent(@fa-var-image); <xf:macro name="content" template="uix_icons.less" arg-icon="media" /> } &[data-nav-id="xfrm"]:before { .m-faContent(@fa-var-th-large); <xf:macro name="content" template="uix_icons.less" arg-icon="resource" /> } &[data-nav-id="EWRporta"]:before, &[data-nav-id="blog"]:before, &[data-nav-id="XPRESS"]:before { .m-faContent(@fa-var-newspaper); <xf:macro name="content" template="uix_icons.less" arg-icon="article" /> } } .p-sectionLinks .p-navEl-link:before, .offCanvasMenu-subList .offCanvasMenu-link:before {display: none !important;} </xf:if> /* ---Force header content fluid --- */ <xf:if is="(property('uix_navigationType') == 'sidebarNav') && (property('uix_pageStyle') == 'covered')"> .p-staffBar .pageContent, .p-header-inner, .p-nav-inner, .p-sectionLinks .pageContent {max-width: 100%;} </xf:if> /* ---Sidebar Navigation --- */ .uix_headerContainer .p-nav-menuTrigger.uix_sidebarNav--trigger {display: none;} <xf:if is="(property('uix_navigationType') == 'sidebarNav') && (property('uix_pageStyle') == 'covered')"> @media (min-width: {{ property('publicNavCollapseWidth') + 1 }}px ) { .uix_page--fluid.sidebarNav--active .p-body-inner { width: calc( ~"100% - {{ property('uix_sidebarNavWidth') }} - {{property('elementSpacer') * 2 }}px"); } .uix_headerContainer .p-nav-menuTrigger.uix_sidebarNav--trigger {display: inline-block;} .uix_page--fixed.sidebarNav--active .p-body-inner { @media (max-width: @uix_sidebarNavBreakpoint) { width: calc( ~"100% - {{ property('uix_sidebarNavWidth') }} - {{property('elementSpacer') * 2 }}px"); } @media (min-width: calc(@uix_sidebarNavBreakpoint + 1px) ) { left: -105px; } } } </xf:if> .uix_sidebarNav__inner__widgets { padding: @xf-paddingLarge; } .sidebarNav--active .uix_sidebarNav { margin-left: 0; } .uix_stickyBodyElement:not(.offCanvasMenu) { position: sticky; position: -webkit-sticky; <xf:comment> -- sticky test -- .uix_stickyBottom & { top: unset !important; bottom: @xf-elementSpacer; margin-top: auto; } </xf:comment> } .uix_stickyBottom .p-body-sidebar {display: flex;} .uix_sidebarNav { .uix_sidebarNav__inner { overflow: hidden; } .uix_sidebar--scroller { overflow-y: auto; margin-right: -30px; padding-right: 32px; } } <xf:if is="property('uix_stickySidebar') == 'top'"> .uix_sidebarInner, .p-body-sideNavInner:not(.offCanvasMenu) { position: static; } @media (min-width: {{property('uix_sidebarBreakpoint') + 1}}px ) { .uix_sidebarInner, .p-body-sideNavInner { position: sticky; position: -webkit-sticky; } <xf:if is="property('uix_scrollableSidebar')"> .uix_sidebarInner, .p-body-sideNavInner { overflow: hidden; .block { margin-left: 2px; margin-rght: 2px; } .uix_sidebar--scroller { overflow-y: auto; max-height: 90vh; margin-right: -30px; padding-right: 32px; padding-top: 2px; padding-bottom: 2px; } } </xf:if> } </xf:if> .offCanvasMenu .offCanvasMenu-link:before { font-size: @xf-uix_iconSizeLarge !important; padding-right: 1em; } .offCanvasMenu-link { display: flex; align-items: center; &.offCanvasMenu-link--splitToggle {font-size: 18px;} } .uix_sidebarNav { .xf-uix_sidebarNavigationStyle(); width: @xf-uix_sidebarNavWidth; min-width: @xf-uix_sidebarNavWidth; padding-bottom: @xf-elementSpacer; margin-left: -{{property('uix_sidebarNavWidth')}}; <xf:if is="property('uix_pageStyle') != 'covered'"> padding-top: @xf-elementSpacer; </xf:if> z-index: 1; transition: ease-in-out margin-left .3s; @media (max-width: @xf-publicNavCollapseWidth) { margin-left: -{{property('uix_sidebarNavWidth')}} !important; } .uix_sidebarNavList { padding: 10px 0; margin: 0; border-bottom: 1px solid @xf-borderColor; line-height: 40px; &:first-child {padding-top: 0;} &:last-child {border-bottom: none;} .uix_sidebarNav__subNav { display: block; height: 0; overflow: hidden; transition: ease-in height .3s; &.subNav--expand {height: auto;} } .menu-linkRow { padding: 0 @xf-paddingLarge; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: @xf-textColorDimmed; border: none; .xf-uix_canvasNavSubItem(); &:hover { border: none; .xf-uix_canvasNavItemHover(); } } .p-navEl-link span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-width: 0; } .uix_sidebarNavList__title { padding: 0 @xf-paddingLarge; font-size: @xf-fontSizeSmaller; color: @xf-textColorMuted; } > li { display: block; .p-navEl:before, .p-navEl:after {display: none;} .p-navEl__inner { display: flex; align-items: center; .xf-uix_canvasNavItem(); } .p-navEl__inner:hover, .blockLink:hover { .xf-uix_canvasNavItemHover(); } .is-selected .p-navEl__inner { .xf-uix_canvasNavItemActive(); a, .p-navEl-link { color: inherit; } } .p-navEl {display: block;} .p-navEl-link, .p-navEl-linkHolder, .blockLink { display: flex; align-items: center; padding: 0 @xf-paddingLarge; color: @xf-textColorDimmed; background: none; width: 100%; text-decoration: none; float: none; &:before { font-size: @xf-uix_iconSizeLarge !important; width: @xf-uix_iconSizeLarge !important; padding-right: 1em; } } .p-navEl-linkHolder {padding: 0;} .blockLink { padding-left: 50px; } .uix_sidebarNav--trigger { font-size: @xf-uix_iconSize; color: inherit; padding-right: @xf-paddingLarge; .uix_icon {transition: ease-in transform .3s;} &.is-expanded .uix_icon {transform: rotate(-180deg);} } .p-navEl-splitTrigger, .p-navEl-link--menuTrigger:after {display: none;} } } } /* ---VISITOR TABS --- */ .p-account { background-color: transparent; .p-navgroup-link { display: flex; align-items: center; border: none; } } .p-nav .p-navgroup-link:hover {.xf-publicNavTabHover();} {{ include('uix_searchComponent.less') }} /* ---UTILITIES --- */ .media__container { display: flex; .media--left {margin-right: @xf-paddingMedium;} } {{ include('uix_footer.less') }} /* ---Login form sliding panel --- */ <xf:if is="property('uix_loginStyle') == 'slidingPanel'"> .uix__loginForm--panel { background: @xf-contentHighlightBg; overflow: hidden; position: absolute; z-index: 200; transition: ease-in .2s transform; left: 0; right: 0; transform: translateY(-100%); top: 0; } .uix__loginForm--mask { position: absolute; top: 0; left: 0; right: 0; background-color: transparent; transition: ease-in .2s background-color; } .uix__loginForm.is-active .uix__loginForm--panel {transform: translateY(0);} .uix__loginForm.is-active .uix__loginForm--mask { background-color: rgba(0,0,0,.4); bottom: 0; } .uix__loginForm--panel form { .m-pageWidth(); } .uix__loginForm--panel .block-container, .uix__loginForm--panel .formRow > dt, .uix__loginForm--panel .formRow > dd, .uix__loginForm--panel .formSubmitRow-bar { background: none; box-shadow: none; border: none; } .uix__loginForm--panel .block-outer {display: none;} </xf:if> .uix_discussionList { .xf-uix_discussionList(); } [type=checkbox], [type=radio], legend {margin-right: .5em;} .structItem-extraInfo [type=checkbox] {margin-right: 0;} form.structItem { display: flex; max-width: 100%; } .structItem-cell--newThread {flex-grow: 1; min-width: 0;} .uix_messageContent { flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; width: 100%; } .uix_socialMedia { display: inline-flex; flex-wrap: wrap; margin: 0 -6px; padding: 0; li {display: inline-block;} li a { margin: 6px; line-height: 1; display: inline-block; .xf-uix_socialMediaIcon(); } } .uix_headerContainer { display: flex; flex-direction: column; <xf:if is="property('uix_pageStyle') != 'wrapped'"> @media (min-width: {{ property('responsiveEdgeSpacerRemoval') + 1 }}px) { margin-top: @xf-uix_headerWhiteSpace; } </xf:if> @media (min-width: @xf-responsiveMedium) { > *:not(.p-nav) { margin-bottom: @xf-uix_headerWhiteSpace; &:last-child {margin-bottom: 0;} } } } <xf:if is="property('uix_detachedNavigation')"> .p-body > * {padding-top: @xf-elementSpacer;} </xf:if> .uix_pageWrapper--fixed { <xf:if is="property('uix_pageStyle') != 'wrapped'"> width: 100%; </xf:if> <xf:if is="property('uix_pageStyle') == 'wrapped'"> .m-pageWidth(); .uix_page--fluid & { @media (min-width: @xf-pageWidthMax) { max-width: 95%; } } @media (max-width: @xf-responsiveEdgeSpacerRemoval) { padding: 0 !important; } </xf:if> position: relative; left: 0; transition: max-width .2s, ease-in left .2s; } /* --- post thread widget --- */ .uix_postThreadWidget { border-top: 4px solid @xf-uix_primaryColor; text-align: center; padding: @xf-paddingLarge; color: @xf-textColorDimmed; i { height: 50px; width: 50px; line-height: 50px; border-radius: 100%; background-color: fade(@xf-uix_primaryColor, 20%); color: @xf-uix_primaryColor; display: inline-block; font-size: @xf-uix_iconSizeLarge; } .uix_postThreadWidget__title { font-size: @xf-fontSizeLarger; font-weight: @xf-fontWeightHeavy; color: @xf-textColor; } .button {margin-top: @xf-paddingMedium;} } <xf:if is="property('uix_borderRadiusJs')"> /* --- border radius javascript --- */ @media (min-width: @xf-responsiveEdgeSpacerRemoval) { .uix_smartBorder--noTop { border-bottom-left-radius: @xf-borderRadiusLarge !important; border-bottom-right-radius: @xf-borderRadiusLarge !important; } .uix_smartBorder--noBottom { border-top-left-radius: @xf-borderRadiusLarge !important; border-top-right-radius: @xf-borderRadiusLarge !important; } .uix_smartBorder--default { border-top-left-radius: @xf-borderRadiusLarge !important; border-top-right-radius: @xf-borderRadiusLarge !important; border-bottom-left-radius: @xf-borderRadiusLarge !important; border-bottom-right-radius: @xf-borderRadiusLarge !important; } } </xf:if> // overlay content .block-footer.uix_conversationsFooterMobile { display: none; .overlay & { display: flex; } } .overlay .block-footer { position: sticky; bottom: 0; } <xf:if is="property('uix_visitorTabsMobile') == 'tabbar'"> /* -- tab bar -- */ .uix_tabBar { height: 46px; @media (min-width: @xf-responsiveNarrow) { display: none; } } .uix_tabList { z-index: 100; margin: 0; padding: 0; display: flex; background: @xf-uix_primaryColor; position: fixed; text-transform: capitalize; bottom: 0; left: 0; right: 0; box-shadow: 0 0 2px 0 rgba(0,0,0,0.14), 0 -2px 2px 0 rgba(0,0,0,0.12), 0 -1px 3px 0 rgba(0,0,0,.2); .uix_tabItem { flex-grow: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 5px; height: 46px; color: rgba(255,255,255,.5); line-height: 1; font-size: 10px; position: relative; &:hover { text-decoration: none; color: #fff; } } .badgeContainer:after { position: absolute; top: 7px; right: 30%; } .uix_tabItem i { font-size: 24px; } } </xf:if> // remove border on macro components for mobile @media (max-width: @xf-responsiveEdgeSpacerRemoval) { .uix_headerContainer > *, .p-nav, .p-footer > * {border-radius: 0 !important;} } // nav edits for mobile // staff bar <xf:if is="property('uix_staffBarBreakpoint') != '100%'"> .uix_responsiveStaffBar { @media (max-width: @xf-uix_staffBarBreakpoint) { .p-staffBar {display: none;} } } @media (max-width: @xf-uix_staffBarBreakpoint) { .p-staffBar .p-nav-opposite {display: none;} } @media (min-width: {{ property('uix_staffBarBreakpoint') + 1 }}px ) { <xf:if is="property('uix_searchPosition') == 'staffBar'"> .p-nav .uix_searchBar {display: none;} </xf:if> <xf:if is="property('uix_userTabsPosition') == 'staffBar'"> .p-nav .p-navgroup--member, .p-nav .p-navgroup-link--whatsnew {display: none;} </xf:if> <xf:if is="property('uix_loginTriggerPosition') == 'staffBar'"> .p-nav .p-navgroup--guest {display: none;} </xf:if> } <xf:else /> .p-staffBar .p-navgroup--member, .p-nav .p-navgroup-link--whatsnew {display: none;} .p-staffBar .p-navgroup--guest {display: none;} .p-staffBar .uix_searchBar {display: none;} </xf:if> /* --- show logoblock for desktop --- */ <xf:if is="property('uix_viewportShowLogoBlock') != '100%'"> @media (max-width: {{ property('uix_viewportShowLogoBlock') - 1 }}px ) { .p-header {display: none;} } @media (max-width: {{ property('uix_viewportShowLogoBlock') - 1 }}px ) { .p-header .p-nav-opposite {display: none;} } @media (min-width: @xf-uix_viewportShowLogoBlock) { .p-nav-inner .p-header-logo {display: none;} <xf:if is="property('uix_userTabsPosition') == 'header'"> .p-nav .p-navgroup--member, .p-nav .p-navgroup-link--whatsnew {display: none;} </xf:if> <xf:if is="property('uix_searchPosition') == 'header'"> .uix_headerContainer > *:not(.p-header) .uix_searchBar {display: none;} </xf:if> <xf:if is="property('uix_searchPosition') == 'header'"> .uix_headerContainer > *:not(.p-header) .uix_searchBar {display: none;} </xf:if> } <xf:else /> .p-header {display: none;} </xf:if> /* sub-navigation */ <xf:if is="property('uix_viewportWidthRemoveSubNav') != '100%'"> @media (max-width: @xf-uix_viewportWidthRemoveSubNav ) { <xf:if is="!property('publicNavSelected--background-color')"> .p-sectionLinks {display: none;} <xf:else /> .p-sectionLinks > * {display: none;} @media(max-width: @xf-publicNavCollapseWidth) { .p-sectionLinks {display: none;} } </xf:if> } @media (min-width: {{ property('uix_viewportWidthRemoveSubNav') + 1 }}px ) { <xf:if is="property('uix_searchPosition') == 'tablinks'"> .p-nav .uix_searchBar {display: none;} </xf:if> <xf:if is="property('uix_userTabsPosition') == 'tablinks'"> .p-nav .p-navgroup--member, .p-nav .p-navgroup-link--whatsnew {display: none;} </xf:if> <xf:if is="property('uix_loginTriggerPosition') == 'tablinks'"> .p-nav .p-navgroup--guest {display: none;} </xf:if> <xf:if is="property('uix_sidebarTriggerPosition') == 'sectionLinks'"> .breadcrumb a.uix_sidebarTrigger__component {display: none;} </xf:if> } <xf:else /> <xf:if is="!property('publicNavSelected--background-color')"> .p-sectionLinks {display: none;} <xf:else /> .p-sectionLinks > * {display: none;} @media(max-width: @xf-publicNavCollapseWidth) { .p-sectionLinks {display: none;} } </xf:if> </xf:if> // search navigation <xf:if is="property('uix_searchPosition') == 'navigationLeft'"> .p-nav .p-nav-opposite .uix_searchBar {display: none;} </xf:if> .menu--account .avatar-update a { max-width: 21px; overflow: hidden; font-size: 12px; } // label.iconic.iconic--labelled > input + i {margin-top: -2px; width: auto;} .comment-reply-link:before { .m-faBase(); .m-faContent(@fa-var-comment-alt); <xf:macro name="content" template="uix_icons.less" arg-icon="post" /> margin-right: 4px; } .sidePanel__tabs .badgeContainer:after { position: relative; top: -15px; left: -5px; } // notices //scrolling notices .lSSlideOuter.noticeScrollContainer { position: relative; .lSPager { margin-top: 0px; position: absolute; bottom: 0; left: 0; right: 0; height: 20px; background: none; } .notice-content {margin-bottom: 20px;} } // bottom notice .notices--bottom_fixer .notice--cookie { .notice-content { display: flex; @media (max-width: @xf-responsiveMedium) { text-align: center; align-items: center; flex-direction: column; } } .u-inputSpacer {margin-top: 0;} .uix_cookieButtonRow { margin: 0 -3px -3px @xf-paddingMedium; @media (max-width: @xf-responsiveMedium) { margin-top: @xf-paddingMedium; margin-left: -3px; } .button {margin: 3px;} } .notice-content > div:first-child { flex-grow: 1; justify-content: center; display: flex; flex-direction: column; } } .uix_mobileNodeTitle { &:before { content: "\00a0\00B7\00a0"; } @media (min-width: @xf-uix_discussionListCollapseWidth) { display: none; } } // MENU .menu { transition: @uix_move .26s transform, @uix_move .26s opacity; transform: translateY(-10px); opacity: 0; &.is-active { transform: translateY(0); opacity: 1; } } .input input {box-shadow: none !important;} <xf:if is="property('uix_clickableThreads')"> .structItem--thread:hover {cursor: pointer;} </xf:if> .uix_sidebarNav .uix_sidebarNav__inner__widgets, .offCanvasMenu-content .uix_sidebarNav__inner__widgets { .block-container, .block-minorHeader, .block-footer, .block-body .block-row { border: none; box-shadow: none; background: none; padding: 0; &:not(:last-child) { padding-bottom: @xf-paddingLarge; } } .block:not(:last-child) .block-container { border-bottom: 1px solid @xf-borderColor; padding-bottom: @xf-paddingLarge; } .block-minorHeader { font-size: @xf-fontSizeSmaller; color: @xf-textColorMuted; &:before {display: none !important;} } [data-widget-definition="th_bookmarks"] { .bookmarkRow { line-height: 40px; display: flex; align-items: center; color: @xf-textColorDimmed; .contentRow-minor, .bookmarkRow-forum {display: none;} .bookmarkRow-content { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } .block-row {padding: 0 !important;} .contentRow-main.contentRow-main--close {padding: 0;} i:before, a {color: inherit;} .block-footer, .contentRow-main:before {display: none;} .contentRow-figure { height: 24px; padding-right: 1em; font-size: 24px; .avatar, i { font-size: 24px; width: 24px; height: 24px; vertical-align: inherit; } .node-icon { width: auto; } } } } <xf:if is="!property('uix_sidebarTriggerPhrase')"> .uix_sidebarTrigger--phrase {display: none;} </xf:if> .uix_headerInner--opposite a.uix_sidebarTrigger__component { padding: 0 4px; i {margin: 0;} } .uix_originalPoster__icon { height: 19px; width: 19px; background: @xf-uix_primaryColor; display: inline-block; border-radius: 100%; .m-uix_whiteText(@xf-uix_primaryColor); text-align: center; }]]>

</template>


-<template title="uix_megaMenu.less" version_string="" version_id="0" addon_id="" type="public">

<![CDATA[.uix_showMegaMenu + .p-sectionLinks {display: none;} .uix_megaMenu { display: none; overflow: hidden; position: relative; background: @xf-contentBg; .pageContent { .m-pageWidth(); } .uix_showMegaMenu & { display: block; } .uix_megaMenu__content { display: none; &--active {display: block;} } .uix_megaMenu__title {margin: 0; color: @xf-textColor;} .uix_megaMenu__row { display: flex; flex-wrap: wrap; padding: 15px 0; margin: 0 -15px; .uix_megaMenu__col { flex-basis: 250px; padding: 15px; &:not(:first-child) { flex-grow: 1; } .blockLink { padding: 5px 0; color: @xf-textColorDimmed; background: none; line-height: 1; &:hover {background: none; color: @xf-textColor;} } .uix_footerLink .blockLink { padding: 1px 0; margin-bottom: 8px; } &.uix_megaMenu__col--alt { position: relative; padding: 15px 45px; margin-left: 30px; flex-grow: 0; &:before { content: ''; display: block; background: @xf-contentAltBg; position: absolute; top: -15px; bottom: -15px; left: 0; right: -400px; } } } } .uix_megaMenu__iconLink { display: flex; align-items: center; i { font-size: 16px; color: @xf-uix_primaryColor; padding-right: 4px; } } .block-minorHeader { padding: 0 0 10px; border-bottom: 1px solid rgba(0,0,0,.12); margin-bottom: 5px; } .uix_megaMenu__listLabel { text-transform: uppercase; color: @xf-textColorMuted; font-size: @xf-fontSizeSmall; margin-top: 20px; } }]]>

</template>


-<template title="uix_pro.less" version_string="" version_id="0" addon_id="" type="public">

<![CDATA[// HEADER .p-account {font-size: @xf-fontSizeSmall;} .m-io_navLine() { position: absolute; bottom: 10px; left: @xf-publicNavPaddingH - 4px; right: @xf-publicNavPaddingH - 4px; height: 4px; border-radius: @xf-borderRadiusLarge; background: @xf-borderColor; display: block; transition: ease-in .2s right; } .p-nav-list .p-navEl { position: relative; &:after {right: 100%;} &:hover:after { .m-io_navLine(); } &.is-selected:after { .m-io_navLine(); background: @xf-uix_primaryColor; } } // NODES .category--collapsed .block-header { border-bottom-left-radius: @xf-borderRadiusLarge; border-bottom-right-radius: @xf-borderRadiusLarge; } .block.block--category { .block-header { position: relative; transition: ease-in .15s border-bottom-left-radius, ease-in .15s border-bottom-right-radius; } > .block-container:before { content: ''; height: 4px; border-radius: @xf-borderRadiusLarge; display: block; background: @xf-uix_primaryColor; } } .block-body .node + .node {border: none;} .node--unread .node-icon i { background: @xf-uix_primaryColor; } .has-flexbox .node .node-body .node-icon { display: inline-flex; align-items: center; justify-content: center; } .block-body .node { &:first-child .node-body { border-top-left-radius: @xf-borderRadiusMedium; border-top-right-radius: @xf-borderRadiusMedium; } &:last-child .node-body { border-bottom-left-radius: @xf-borderRadiusMedium; border-bottom-right-radius: @xf-borderRadiusMedium; } } // WELCOME SECTION .uix_welcomeSection .button.button--cta { background: #fff; color: @xf-uix_primaryColor; &:hover, &:active, &:focus { color: #fff; background: @xf-uix_primaryColor; } } // SIDEBAR @supports not (display: contents) { .uix_sidebarInner:not(.offCanvasMenu-content) .block { .block-minorHeader, .block-header { position: absolute; transform: translateY(-100%); width: 100%; height: 30px; padding-top: 0; + .block-body { margin-top: 60px; } } &:first-child { <xf:if is="property('uix_stickySidebar') == 'sticky'"> .block-minorHeader + .block-body {margin-top: 155px;} <xf:else /> .block-minorHeader + .block-body {margin-top: 30px;} </xf:if> } } } @supports (display: contents) { .uix_sidebarInner:not(.offCanvasMenu-content) .block { .block-container { display: contents; } .block-minorHeader { } .block-body { .xf-contentBase(); .xf-blockBorder() border-radius: @xf-blockBorderRadius; .xf-uix_blockContainer(); .xf-uix_sidebarWidgetWrapper(); &:not(:last-child) { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } } } } // FOOTER .uix_extendedFooter { position: relative; &:before { position: absolute; top: 0; width: 100%; content: ''; display: block; height: 4px; background: @xf-uix_primaryColor; } } // DISCUSSION LIST body .structItem {border: none;} .block-container .structItemContainer { padding: @xf-paddingLarge; display: block; .structItemContainer-group {display: block;} } .block-body .block-minorHeader.uix_threadListSeparator { position: relative; padding-bottom: @xf-uix_structPaddingV + 4px; &:before { content: " "; display: table; background: @xf-uix_primaryColor; position: absolute; bottom: 0; left: 0; right: 0; height: 4px; display: block; border-radius: 8px; } } // Post Comments .p-body-inner .block--messages .message .thpostcomments_commentsContainer { border-top: none; border-radius: @xf-borderRadiusLarge; background: @xf-contentAltBg; padding: 1px 0 @xf-messagePadding; margin: @xf-messagePadding; margin-top: 0px; .message {background: none;} } .p-body-inner .thpostcomments_commentsContainer .message:after {display: none;} // MESSAGES .block-container .message + .message, .message.message--bordered {border-top: none;} .message:last-child {padding-bottom: 1px; magin-bottom: -1px;} .block.block--messages .block-container, .block.js-quickReply .block-container { box-shadow: @xf-uix_elevation1; } .actionBar-action .iconic--checkbox i:before {color: @xf-textColorMuted;} .message:not(:last-child) { position: relative; padding-bottom: 4px; &:after { content: ''; position: absolute; bottom: 0; left: @xf-messagePadding; right: @xf-messagePadding; height: 4px; border-radius: @xf-borderRadiusLarge; background: @xf-borderColor; display: block; } } .message-responses .message-responseRow { border: none; &:first-child { border-top-left-radius: @xf-borderRadiusLarge; border-top-right-radius: @xf-borderRadiusLarge; } &:last-child { border-bottom-left-radius: @xf-borderRadiusLarge; border-bottom-right-radius: @xf-borderRadiusLarge; } &.toggleTarget { border-radius: @xf-borderRadiusLarge; } } // FOOTER .uix_extendedFooterRow .blockLink { padding-left: 0; padding-right: 0; } .pageNav-page { &:first-child { border-top-left-radius: @xf-borderRadiusSmall; border-bottom-left-radius: @xf-borderRadiusSmall; } &:last-child { border-top-right-radius: @xf-borderRadiusSmall; border-bottom-right-radius: @xf-borderRadiusSmall; } } .pageNav-jump {border-radius: @xf-borderRadiusSmall;} .pageNav-page.pageNav-page--current { box-shadow: none; background: @xf-uix_primaryColor; color: #fff; border-color: @xf-uix_primaryColor; } .node .pairs > dd { font-size: @xf-fontSizeNormal; } .uix_tabList { background: @xf-uix_primaryColor; .uix_tabItem {color: rgba(255,255,255,.7);} } .p-header-logo--image img {transition: ease-in .1s max-height;} .uix_searchBar .input {box-shadow: none;} .filterBar-filterToggle, .label, .userBanner, body .thTopic {border-radius: 2px; }]]>

</template>

</templates>


-<properties>


-<property title="Block filter bar" description="When the content of a block can be filtered, the controls to do so are styled here" addon_id="XF" css_components="text,background,border,extra" display_order="20800" value_group="" depends_on="" value_type="" property_type="css" group_name="block" property_name="blockFilterBar">

<value>{ "font-size": "@xf-fontSizeSmall", "color": "@xf-textColor", "background-color": "@xf-contentBg", "border-bottom-width": "1px", "border-bottom-color": "@xf-borderColor" }</value>

</property>


-<property title="Block minor header" description="" addon_id="XF" css_components="text,background,border,extra" display_order="20400" value_group="" depends_on="" value_type="" property_type="css" group_name="block" property_name="blockMinorHeader">

<value>{ "font-size": "@xf-fontSizeNormal", "color": "@xf-minorHeadingTextColor", "font-weight": "@xf-fontWeightHeavy" }</value>

</property>


-<property title="Border color" description="" addon_id="XF" display_order="4000" value_group="borderBasic" depends_on="" value_type="color" property_type="value" group_name="color" property_name="borderColor">

<value>"xf-intensify(@xf-contentHighlightBg, 6%)"</value>

</property>


-<property title="Large border radius" description="" addon_id="XF" display_order="1200" value_group="borderRadius" depends_on="" value_type="unit" property_type="value" group_name="borderSpacing" property_name="borderRadiusLarge">

<value>"8px"</value>

</property>


-<property title="Medium border radius" description="" addon_id="XF" display_order="1100" value_group="borderRadius" depends_on="" value_type="unit" property_type="value" group_name="borderSpacing" property_name="borderRadiusMedium">

<value>"8px"</value>

</property>


-<property title="Small border radius" description="" addon_id="XF" display_order="1000" value_group="borderRadius" depends_on="" value_type="unit" property_type="value" group_name="borderSpacing" property_name="borderRadiusSmall">

<value>"4px"</value>

</property>


-<property title="Button base" description="Defines the styling for the basic elements that are common to all text-based buttons" addon_id="XF" css_components="text,border_radius,padding,extra" display_order="20000" value_group="" depends_on="" value_type="" property_type="css" group_name="button" property_name="buttonBase">

<value>{ "font-size": "15px", "font-weight": "@xf-fontWeightNormal", "border-radius": "@xf-borderRadiusMedium", "padding-top": "0", "padding-right": "15px", "padding-bottom": "0", "padding-left": "15px", "extra": "text-align: center;\noutline: none;\nline-height: 35px;\nheight: 35px;\ntext-decoration: none;\ndisplay: inline-flex;\nalign-items: center;\njustify-content: center;\ncursor: pointer;\nbox-sizing: content-box;\n-webkit-appearance: none;\nwill-change: box-shadow;\ntransition: all 0.3s cubic-bezier(.25,.8,.25,1);\nborder: none;\nwhite-space: nowrap;\nborder-radius: @xf-borderRadiusSmall;" }</value>

</property>


-<property title="Button - call to action" description="Call to action buttons sit alone and invite the user to do something, like post a new thread" addon_id="XF" css_components="text,background,extra" display_order="20300" value_group="" depends_on="" value_type="" property_type="css" group_name="button" property_name="buttonCta">

<value>{ "color": "#fff", "background-color": "@xf-buttonCtaBg", "extra": "box-shadow: @xf-uix_elevation1;\nborder: none;\nbackground: linear-gradient(@xf-uix_secondaryColor, darken(@xf-uix_secondaryColor, 10%) );" }</value>

</property>


-<property title="Button - primary" description="These rules are used mostly for the main submit button for forms" addon_id="XF" css_components="text,background,extra" display_order="20200" value_group="" depends_on="" value_type="" property_type="css" group_name="button" property_name="buttonPrimary">

<value>{ "color": "#fff", "background-color": "@xf-buttonPrimaryBg", "extra": "box-shadow: @xf-uix_elevation1;\nborder: none;\nbackground: linear-gradient(@xf-uix_primaryColor, darken(@xf-uix_primaryColor, 10%) );" }</value>

</property>


-<property title="Large font size" description="" addon_id="XF" display_order="1400" value_group="size" depends_on="" value_type="unit" property_type="value" group_name="fonts" property_name="fontSizeLarge">

<value>"1.4rem"</value>

</property>


-<property title="Larger font size" description="" addon_id="XF" display_order="1500" value_group="size" depends_on="" value_type="unit" property_type="value" group_name="fonts" property_name="fontSizeLarger">

<value>"1.5rem"</value>

</property>


-<property title="Largest font size" description="" addon_id="XF" display_order="1600" value_group="size" depends_on="" value_type="unit" property_type="value" group_name="fonts" property_name="fontSizeLargest">

<value>"2.4rem"</value>

</property>


-<property title="Normal font size" description="" addon_id="XF" display_order="1000" value_group="size" depends_on="" value_type="unit" property_type="value" group_name="fonts" property_name="fontSizeNormal">

<value>"1.3rem"</value>

</property>


-<property title="Small font size" description="" addon_id="XF" display_order="1100" value_group="size" depends_on="" value_type="unit" property_type="value" group_name="fonts" property_name="fontSizeSmall">

<value>"1.2rem"</value>

</property>


-<property title="Smaller font size" description="" addon_id="XF" display_order="1200" value_group="size" depends_on="" value_type="unit" property_type="value" group_name="fonts" property_name="fontSizeSmaller">

<value>"1.2rem"</value>

</property>


-<property title="Smallest font size" description="" addon_id="XF" display_order="1300" value_group="size" depends_on="" value_type="unit" property_type="value" group_name="fonts" property_name="fontSizeSmallest">

<value>"1.1rem"</value>

</property>


-<property title="Heavy font weight" description="" addon_id="XF" display_order="2200" value_group="weight" depends_on="" value_type="number" property_type="value" group_name="fonts" property_name="fontWeightHeavy">

<value_parameters>step=100 min=100 max=900</value_parameters>

<value>"500"</value>

</property>


-<property title="Form input" description="Controls the style of most text-input boxes" addon_id="XF" css_components="text,background,border,border_radius,padding,extra" display_order="20000" value_group="" depends_on="" value_type="" property_type="css" group_name="input" property_name="input">

<value>{ "font-size": "@xf-fontSizeNormal", "color": "@xf-textColor", "background-color": "@xf-inputBgColor", "border-width": "@xf-borderSize", "border-radius": "@xf-borderRadiusMedium", "border-top-color": "@xf-borderColorHeavy", "border-right-color": "@xf-borderColorLight", "border-bottom-color": "@xf-borderColorLight", "border-left-color": "@xf-borderColorHeavy", "padding": "6px", "extra": "box-shadow: inset 0 1px 4px rgba(0,0,0,.1);" }</value>

</property>


-<property title="Member profile header" description="The member profile page's content header is styled with these settings" addon_id="XF" css_components="text,background,border,extra" display_order="20000" value_group="" depends_on="" value_type="" property_type="css" group_name="member" property_name="memberHeader">

<value>{ "background-color": "@xf-contentAltBg", "border-bottom-width": "0", "border-bottom-color": "@xf-borderColorLight" }</value>

</property>


-<property title="Menu" description="Controls the main block of all popup menus" addon_id="XF" css_components="text,background,border_width_simple,border_color_simple,border_radius_simple,extra" display_order="20000" value_group="" depends_on="" value_type="" property_type="css" group_name="menu" property_name="menu">

<value>{ "font-size": "@xf-fontSizeSmall", "color": "@xf-textColor", "background-color": "@xf-contentBg", "border-width": "0", "border-color": "@xf-borderColor", "border-radius": "@xf-borderRadiusSmall", "extra": "box-shadow: 0px 10px 20px rgba(0,0,0,0.15), rgba(0,0,0,0.1) 0px 0px 0px 1px;" }</value>

</property>


-<property title="Message padding" description="When using the full-size message block, this value defines the size of the padding around the message text" addon_id="XF" display_order="200" value_group="padding" depends_on="" value_type="unit" property_type="value" group_name="message" property_name="messagePadding">

<value>"@xf-paddingLarge"</value>

</property>


-<property title="Message padding small" description="This value controls the padding around the message text when using the small message block" addon_id="XF" display_order="400" value_group="padding" depends_on="" value_type="unit" property_type="value" group_name="message" property_name="messagePaddingSmall">

<value>"@xf-paddingLarge"</value>

</property>


-<property title="Message user info block" description="Apart from its width, the (left) message user info column is styled here" addon_id="XF" css_components="text,background,border_width_simple,border_color_simple,extra" display_order="20000" value_group="" depends_on="" value_type="" property_type="css" group_name="message" property_name="messageUserBlock">

<value>{ "border-width": "0" }</value>

</property>


-<property title="Minor heading text color" description="" addon_id="XF" display_order="6400" value_group="heading" depends_on="" value_type="color" property_type="value" group_name="color" property_name="minorHeadingTextColor">

<value>"@xf-textColorDimmed"</value>

</property>


-<property title="Read node icon color" description="" addon_id="XF" display_order="200" value_group="" depends_on="" value_type="color" property_type="value" group_name="nodeList" property_name="nodeIconReadColor">

<value>"@xf-textColorMuted"</value>

</property>


-<property title="Unread node icon color" description="" addon_id="XF" display_order="100" value_group="" depends_on="" value_type="color" property_type="value" group_name="nodeList" property_name="nodeIconUnreadColor">

<value>"#fff"</value>

</property>


-<property title="Sub-forums display style" description="Choose the style in which sub-forums will be displayed within a particular node element, according to the amount of space you want them to occupy" addon_id="XF" display_order="300" value_group="" depends_on="" value_type="radio" property_type="value" group_name="nodeList" property_name="nodeListSubDisplay">

<value_parameters>menu={{ phrase('popup_menu') }} flat={{ phrase('listed_below_node') }} none={{ phrase('none') }}</value_parameters>

<value>"menu"</value>

</property>


-<property title="Accent 1" description="" addon_id="XF" display_order="2000" value_group="accent" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteAccent1">

<value_parameters>hidePalette=true</value_parameters>

<value>"#2175f3"</value>

</property>


-<property title="Accent 2" description="" addon_id="XF" display_order="2100" value_group="accent" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteAccent2">

<value_parameters>hidePalette=true</value_parameters>

<value>"#1767de"</value>

</property>


-<property title="Accent 3" description="" addon_id="XF" display_order="2200" value_group="accent" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteAccent3">

<value_parameters>hidePalette=true</value_parameters>

<value>"#92d049"</value>

</property>


-<property title="Color 2" description="" addon_id="XF" display_order="1100" value_group="primary" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteColor2">

<value_parameters>hidePalette=true</value_parameters>

<value>"#f1f3fb"</value>

</property>


-<property title="Color 3" description="" addon_id="XF" display_order="1200" value_group="primary" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteColor3">

<value_parameters>hidePalette=true</value_parameters>

<value>"#ecf2fb"</value>

</property>


-<property title="Color 4" description="" addon_id="XF" display_order="1300" value_group="primary" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteColor4">

<value_parameters>hidePalette=true</value_parameters>

<value>"rgb(248, 250, 255)"</value>

</property>


-<property title="Color 5" description="" addon_id="XF" display_order="1400" value_group="primary" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteColor5">

<value_parameters>hidePalette=true</value_parameters>

<value>"@xf-paletteColor2"</value>

</property>


-<property title="Neutral 1" description="" addon_id="XF" display_order="3000" value_group="neutral" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteNeutral1">

<value_parameters>hidePalette=true</value_parameters>

<value>"rgb(160, 175, 206)"</value>

</property>


-<property title="Neutral 2" description="" addon_id="XF" display_order="3100" value_group="neutral" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteNeutral2">

<value_parameters>hidePalette=true</value_parameters>

<value>"rgb(112, 130, 167)"</value>

</property>


-<property title="Neutral 3" description="" addon_id="XF" display_order="3200" value_group="neutral" depends_on="" value_type="color" property_type="value" group_name="palette" property_name="paletteNeutral3">

<value_parameters>hidePalette=true</value_parameters>

<value>"rgb(56, 71, 100)"</value>

</property>


-<property title="Footer" description="" addon_id="XF" css_components="text,background,border,extra" display_order="20000" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="publicFooter">

<value>{ "font-size": "@xf-fontSizeSmall", "color": "@xf-textColorDimmed", "background-color": "@xf-contentHighlightBg" }</value>

</property>


-<property title="Footer links" description="Controls styling for individual links within the footer" addon_id="XF" css_components="text,extra" display_order="20100" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="publicFooterLink">

<value>{ "color": "@xf-textColor" }</value>

</property>


-<property title="Logo URL" description="" addon_id="XF" display_order="100" value_group="logo" depends_on="" value_type="string" property_type="value" group_name="basic" property_name="publicLogoUrl">

<value>"@xf-uix_imagePath/images/uixpro-logo.png"</value>

</property>


-<property title="2x logo URL" description="" addon_id="XF" display_order="200" value_group="logo" depends_on="" value_type="string" property_type="value" group_name="basic" property_name="publicLogoUrl2x">

<value>"@xf-uix_imagePath/images/uixpro-logo.png"</value>

</property>


-<property title="Staff tools bar" description="" addon_id="XF" css_components="text,background,border,extra" display_order="20700" value_group="" depends_on="" value_type="" property_type="css" group_name="headerNav" property_name="publicStaffBar">

<value>{ "font-size": "@xf-fontSizeSmall", "color": "rgba(255,255,255,.7)", "background-color": "darken(@xf-publicNav--background-color, 7%)" }</value>

</property>


-<property title="List of additional css templates to include" description="A comma separated list of additional CSS/less templates to load. Requires the .css or .less suffix" addon_id="" display_order="400" value_group="" depends_on="" value_type="string" property_type="value" group_name="uix_globalSettings" property_name="uix_additionalCss">

<value>"uix_material.less,uix_pro.less"</value>

</property>


-<property title="Button - call to action (active)" description="" addon_id="" css_components="text,background,border,padding,extra" display_order="20320" value_group="" depends_on="" value_type="" property_type="css" group_name="button" property_name="uix_buttonCtaActive">

<value>{ "extra": "background: linear-gradient(darken(@xf-uix_secondaryColor, 15%), darken(@xf-uix_secondaryColor, 25%) );" }</value>

</property>


-<property title="Button - call to action (hover)" description="" addon_id="" css_components="text,background,extra" display_order="20310" value_group="" depends_on="" value_type="" property_type="css" group_name="button" property_name="uix_buttonCtaHover">

<value>{ "extra": "box-shadow: @xf-uix_elevation2;\nbackground: linear-gradient(darken(@xf-uix_secondaryColor, 5%), darken(@xf-uix_secondaryColor, 15%) );" }</value>

</property>


-<property title="Button - default (hover)" description="" addon_id="" css_components="text,background,extra" display_order="20110" value_group="" depends_on="" value_type="" property_type="css" group_name="button" property_name="uix_buttonHover">

<value>{ "background-color": "fade(@xf-buttonDefault--color, 15%)" }</value>

</property>


-<property title="Button - primary (active)" description="" addon_id="" css_components="text,background,border,padding,extra" display_order="20220" value_group="" depends_on="" value_type="" property_type="css" group_name="button" property_name="uix_buttonPrimaryActive">

<value>{ "extra": "background: linear-gradient(darken(@xf-uix_primaryColor, 15%), darken(@xf-uix_primaryColor, 25%) );" }</value>

</property>


-<property title="Button primary (hover)" description="" addon_id="" css_components="text,background,extra" display_order="20210" value_group="" depends_on="" value_type="" property_type="css" group_name="button" property_name="uix_buttonPrimaryHover">

<value>{ "color": "#fff", "extra": "box-shadow: @xf-uix_elevation2;\nbackground: linear-gradient(darken(@xf-uix_primaryColor, 5%), darken(@xf-uix_primaryColor, 15%) );" }</value>

</property>


-<property title="Canvas navigation item (active)" description="" addon_id="" css_components="text,background,border,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_canvas" property_name="uix_canvasNavItemActive">

<value>{ "color": "#fff", "background-color": "@xf-uix_primaryColor" }</value>

</property>


-<property title="Category description display" description="" addon_id="" display_order="1100" value_group="uix_nodeCategories" depends_on="" value_type="radio" property_type="value" group_name="nodeList" property_name="uix_categoryDescriptionDisplay">

<value_parameters>tooltip=Tooltip inline=Inline none=None</value_parameters>

<value>"tooltip"</value>

</property>


-<property title="Category Strip" description="Styles the category strip for nodes" addon_id="" css_components="text,background,border,border_radius,border_width_simple,border_color_simple,border_radius_simple,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="nodeList" property_name="uix_categoryStrip">

<value>{ "font-size": "@xf-fontSizeLarger", "font-weight": "@xf-fontWeightHeavy", "border-bottom-width": "0", "padding": "@xf-paddingLarge", "padding-top": "0", "extra": "line-height: 1;" }</value>

</property>


-<property title="Discussion list animation" description="Adds animation to discussion list items on page load" addon_id="" display_order="3200" value_group="uix_pageAnimation" depends_on="" value_type="boolean" property_type="value" group_name="misc" property_name="uix_discussionListAnimation">

<value>1</value>

</property>


-<property title="Width to collapse discussion list items" description="" addon_id="" display_order="0" value_group="" depends_on="" value_type="string" property_type="value" group_name="uix_discussionList" property_name="uix_discussionListCollapseWidth">

<value>"@xf-responsiveMedium"</value>

</property>


-<property title="Discussion list item" description="" addon_id="" css_components="text,background,border,border_radius" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_discussionList" property_name="uix_discussionListItem">

<value>{ "border-radius": "@xf-borderRadiusLarge" }</value>

</property>


-<property title="Discussion list item (even)" description="" addon_id="" display_order="0" value_group="" depends_on="" value_type="color" property_type="value" group_name="uix_discussionList" property_name="uix_discussionListItemEven">

<value>""</value>

</property>


-<property title="Discussion list item (hover)" description="" addon_id="" display_order="0" value_group="" depends_on="" value_type="color" property_type="value" group_name="uix_discussionList" property_name="uix_discussionListItemHover">

<value>"@xf-contentAltBg"</value>

</property>


-<property title="Discussion list item (sticky)" description="" addon_id="" css_components="background,border" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_discussionList" property_name="uix_discussionListItemSticky">

<value>[]</value>

</property>


-<property title="Title" description="" addon_id="" css_components="text" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_discussionList" property_name="uix_discussionListTitle">

<value>{ "font-size": "@xf-fontSizeLarge", "color": "@xf-textColor", "font-weight": "@xf-fontWeightHeavy" }</value>

</property>


-<property title="Elevation 1" description="Sets the box-shadow value for elevation level 1" addon_id="" display_order="2000" value_group="elevation" depends_on="" value_type="string" property_type="value" group_name="uix_globalSettings" property_name="uix_elevation1">

<value>"0 4px 15px 0 fade(shade(darken(@xf-pageBg, 20%), 40%), 20%)"</value>

</property>


-<property title="Elevation 2" description="Sets the box shadow value for elevation level 2" addon_id="" display_order="2100" value_group="elevation" depends_on="" value_type="string" property_type="value" group_name="uix_globalSettings" property_name="uix_elevation2">

<value>"0 4px 15px 0 fade(shade(darken(@xf-pageBg, 20%), 40%), 20%)"</value>

</property>


-<property title="Extended Footer" description="" addon_id="" css_components="text,background,border,border_radius,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="uix_extendedFooterStyle">

<value>{ "background-color": "@xf-contentBg", "border-top-width": "0", "border-top-color": "@xf-borderColor", "border-bottom-width": "0", "padding-top": "@xf-paddingLargest * 2", "padding-bottom": "@xf-paddingLargest * 2", "extra": "line-height: 1.7;" }</value>

</property>


-<property title="Extended Footer White Text" description="Checking this option will add CSS to make all text white for legibility. Only use this Style Property if you have a dark background that is causing legibility issues. (Most often useful for a dark footer on a light theme.)" addon_id="" display_order="2400" value_group="" depends_on="" value_type="boolean" property_type="value" group_name="footer" property_name="uix_extendedFooter__whiteText">

<value>0</value>

</property>


-<property title="Page action as floating action button" description="Adds the page action as a floating action button" addon_id="" display_order="1000" value_group="" depends_on="" value_type="select" property_type="value" group_name="button" property_name="uix_fab">

<value_parameters>never=Never mobile=Mobile always=Always</value_parameters>

<value>"never"</value>

</property>


-<property title="Footer chooser" description="Styles the footer chooser (ex. style chooser, width toggle, language chooser)" addon_id="" css_components="text,background,border,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="uix_footerChooser">

<value>{ "color": "@xf-textColorMuted", "border-width": "2px", "border-color": "@xf-borderColor" }</value>

</property>


-<property title="Footer chooser hover" description="" addon_id="" css_components="text,background,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="uix_footerChooserHover">

<value>{ "color": "@xf-textColor", "background-color": "@xf-borderColor" }</value>

</property>


-<property title="Footer copyright row" description="" addon_id="" css_components="text,background,border,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="uix_footerCopyrightRow">

<value>{ "color": "@xf-textColorDimmed", "padding-top": "0", "padding-bottom": "@xf-paddingLarge" }</value>

</property>


-<property title="Footer links hover" description="" addon_id="" css_components="text,background,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="uix_footerLinkHover">

<value>{ "color": "@xf-uix_primaryColor", "extra": "text-decoration: none;" }</value>

</property>


-<property title="Footer menu" description="Styles the footer menu bar" addon_id="" css_components="text,background,border,border_radius,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="uix_footerMenu">

<value>{ "background-color": "@xf-contentHighlightBg" }</value>

</property>


-<property title="Footer widget header" description="Styles the minor heading block is footer widgets" addon_id="" css_components="text,background,border,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="footer" property_name="uix_footerWidgetHeader">

<value>{ "background-color": "none", "border-bottom-width": "0", "padding": "0", "padding-bottom": "@xf-paddingMedium" }</value>

</property>


-<property title="Icon large font size" description="" addon_id="" display_order="0" value_group="uix_iconOptions" depends_on="" value_type="unit" property_type="value" group_name="uix_icons" property_name="uix_iconSizeLarge">

<value>"22px"</value>

</property>


-<property title="Image path" description="Sets the path to images for the theme." addon_id="" display_order="10" value_group="" depends_on="" value_type="string" property_type="value" group_name="basic" property_name="uix_imagePath">

<value>"styles/uix_pro"</value>

</property>


-<property title="Message" description="Styles the message container" addon_id="" css_components="text,background,border,border_radius,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="message" property_name="uix_message">

<value>{ "border-radius": "0", "extra": "border: none;" }</value>

</property>


-<property title="Message action bar" description="Styles the action bar for messages" addon_id="" css_components="text,background,border,border_radius,padding,extra" display_order="20040" value_group="" depends_on="" value_type="" property_type="css" group_name="message" property_name="uix_messageActionBar">

<value>{ "padding": "@xf-messagePadding", "padding-top": "0", "extra": "margin: -@xf-messagePadding;\nmargin-top: 0;" }</value>

</property>


-<property title="Message animation" description="Adds an animation to messages on page load" addon_id="" display_order="3300" value_group="uix_pageAnimation" depends_on="" value_type="boolean" property_type="value" group_name="misc" property_name="uix_messageAnimation">

<value>1</value>

</property>


-<property title="Message control" description="Styles the message actions such as reply and report" addon_id="" css_components="text,background,border,padding,extra" display_order="20050" value_group="" depends_on="" value_type="" property_type="css" group_name="message" property_name="uix_messageControl">

<value>{ "color": "@xf-textColorMuted", "background-color": "fade(@xf-textColorMuted, 10%)", "padding-right": "5px", "padding-left": "5px", "extra": "border-radius: @xf-borderRadiusSmall;\ndisplay: inline-block;" }</value>

</property>


-<property title="Message control (hover)" description="" addon_id="" css_components="text,background,border,padding,extra" display_order="20060" value_group="" depends_on="" value_type="" property_type="css" group_name="message" property_name="uix_messageControlHover">

<value>{ "color": "@xf-textColorDimmed", "background-color": "fade(@xf-textColorDimmed, 10%)" }</value>

</property>


-<property title="Message like bar" description="Styles the "Likes" bar for messages" addon_id="" css_components="text,background,border,border_radius,padding,extra" display_order="20030" value_group="" depends_on="" value_type="" property_type="css" group_name="message" property_name="uix_messageLikes">

<value>{ "background-color": "@xf-contentAltBg", "border-width": "0", "border-radius": "20px", "padding": "@xf-messagePadding", "padding-top": "10px", "padding-bottom": "10px", "extra": "margin: 0 0 @xf-messagePadding;" }</value>

</property>


-<property title="Meta cell (for discussion list)" description="" addon_id="" css_components="background,border" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_discussionList" property_name="uix_metaCell">

<value>[]</value>

</property>


-<property title="Node animations" description="" addon_id="" display_order="3600" value_group="uix_pageAnimation" depends_on="" value_type="boolean" property_type="value" group_name="misc" property_name="uix_nodeAnimations">

<value>1</value>

</property>


-<property title="Block Body (for nodes)" description="" addon_id="" css_components="background,border,border_radius,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="nodeList" property_name="uix_nodeBlockBody">

<value>{ "border-radius": "@xf-borderRadiusSmall", "padding": "@xf-paddingMedium" }</value>

</property>


-<property title="Node body (even)" description="" addon_id="" display_order="2200" value_group="" depends_on="" value_type="color" property_type="value" group_name="nodeList" property_name="uix_nodeBodyEven">

<value>""</value>

</property>


-<property title="Node body (hover)" description="Adds a hover state to nodes" addon_id="" css_components="background,border,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="nodeList" property_name="uix_nodeBodyHover">

<value>{ "background-color": "@xf-contentAltBg", "extra": "position: relative;\nborder-radius: @xf-borderRadiusMedium;" }</value>

</property>


-<property title="Node Container" description="Styles the block-container for level 1 nodes" addon_id="" css_components="text,background,border,border_radius,border_width_simple,border_color_simple,border_radius_simple,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="nodeList" property_name="uix_nodeContainer">

<value>{ "border-width": "0", "extra": "box-shadow: none;" }</value>

</property>


-<property title="Node icon style" description="" addon_id="" css_components="text,background,border,border_radius,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="nodeList" property_name="uix_nodeIconStyle">

<value>{ "font-size": "24px", "border-radius": "@xf-borderRadiusSmall", "padding": "4px" }</value>

</property>


-<property title="Node Title" description="" addon_id="" css_components="text,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="nodeList" property_name="uix_nodeTitle">

<value>{ "font-size": "@xf-fontSizeLarge", "color": "@xf-textColor", "font-weight": "@xf-fontWeightHeavy", "extra": "margin: 0;" }</value>

</property>


-<property title="Page animations" description="Adds animations to main components (header, sidebars, main content, footer) on page load" addon_id="" display_order="3000" value_group="uix_pageAnimation" depends_on="" value_type="boolean" property_type="value" group_name="misc" property_name="uix_pageAnimation">

<value>1</value>

</property>


-<property title="Search Bar" description="" addon_id="" css_components="text,background,border,border_radius,border_width_simple,border_color_simple,border_radius_simple,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_search" property_name="uix_searchBar">

<value>{ "color": "#fff", "background-color": "lighten(@xf-publicNav--background-color, 7%)", "border-radius": "@xf-borderRadiusMedium", "extra": "box-shadow: none;" }</value>

</property>


-<property title="Side navigation animation" description="Adds an animation to side navigation items on page load" addon_id="" display_order="3500" value_group="uix_pageAnimation" depends_on="" value_type="boolean" property_type="value" group_name="misc" property_name="uix_sideNavigationAnimation">

<value>1</value>

</property>


-<property title="Sidebar widget animation" description="Adds an animation to sidebar widgets on page load" addon_id="" display_order="3100" value_group="uix_pageAnimation" depends_on="" value_type="boolean" property_type="value" group_name="misc" property_name="uix_sidebarWidgetAnimations">

<value>1</value>

</property>


-<property title="Sidebar widget heading" description="" addon_id="" css_components="text,background,border,border_radius,border_width_simple,border_color_simple,border_radius_simple,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_sidebar" property_name="uix_sidebarWidgetHeading">

<value>[]</value>

</property>


-<property title="Thread list separators" description="Styles the thread list separate when Separate Sticky Threads is enabled." addon_id="" css_components="text,background,border,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_discussionList" property_name="uix_threadListSeparator">

<value>{ "font-size": "@xf-fontSizeSmall", "color": "@xf-textColorDimmed", "background-color": "transparent", "padding-top": "10px", "padding-bottom": "10px", "extra": "text-transform: uppercase;" }</value>

</property>


-<property title="Viewport width to collapse node stats" description="This sets the minimum viewport width to show the full node stat display. (Note: not applicable with Node Grid)" addon_id="" display_order="2500" value_group="uix_nodeStats" depends_on="" value_type="unit" property_type="value" group_name="nodeList" property_name="uix_viewportCollapseStats">

<value>"1000px"</value>

</property>


-<property title="Welcome section container" description="" addon_id="" css_components="background,border,border_radius,padding,extra" display_order="0" value_group="" depends_on="" value_type="" property_type="css" group_name="uix_welcomeSection" property_name="uix_welcomeSection__style">

<value>{ "background-color": "@xf-uix_primaryColor", "background-image": "url('@xf-uix_imagePath/images/welcome-banner.png')", "border-radius": "8px", "extra": "margin-bottom: @xf-elementSpacer;\nbackground-size: cover;\nbackground-position: center;" }</value>

</property>

</properties>

</style>