- Joined
- Apr 12, 2018
- Messages
- 8,591
- Reaction score
- 17,710
- Age
- 32
- Location
- Long Island, NY
- Website
- tacoma3g.com
Quicksand
Disregard.
HTML:
@_nodeList-statsCellBreakpoint: 1000px;
.node
{
& + .node
{
border-top: @xf-borderSize solid @xf-borderColorFaint;
}
}
.node-body
{
display: table;
table-layout: fixed;
width: 100%;
}
.node-icon
{
display: table-cell;
vertical-align: middle;
text-align: center;
width: 36px;
padding-top: 15px;
padding-left: 10px;
i
{
display: block;
line-height: 1.125;
font-size: 22px;
&:before
{
.m-faBase();
color: @xf-nodeIconReadColor;
.node--unread &
{
opacity: 1;
color: @xf-nodeIconUnreadColor;
}
}
.node--category &:before
{
.m-faContent(@fa-var-comments);
}
.node--search &::before
{
.m-faContent(@fa-var-search);
}
.node--page &:before
{
.m-faContent(@fa-var-file-alt);
}
.node--link &:before
{
.m-faContent(@fa-var-link);
}
}
}
.node-main
{
display: table-cell;
vertical-align: middle;
padding: @xf-paddingLargest;
padding-left: 5px;
}
.node-stats
{
display: table-cell;
width: 140px;
vertical-align: middle;
text-align: center;
padding: @xf-paddingLarge 0;
> dl.pairs.pairs--rows
{
width: 50%;
float: left;
margin: 0;
padding: 0 @xf-paddingMedium/2;
&:first-child
{
padding-left: 0;
}
&:last-child
{
padding-right: 0;
}
}
&.node-stats--single
{
width: 100px;
> dl.pairs.pairs--rows
{
width: 100%;
float: none;
}
}
&.node-stats--triple
{
width: 240px;
> dl.pairs.pairs--rows
{
width: 33.333%;
}
}
@media (max-width: @_nodeList-statsCellBreakpoint)
{
display: none;
}
}
@_nodeExtra-avatarSize: 36px;
.node-extra
{
display: table-cell;
vertical-align: middle;
width: 280px;
padding: @xf-paddingLarge;
font-size: @xf-fontSizeSmall;
}
.node-extra-row
{
.m-overflowEllipsis();
color: @xf-textColorMuted;
}
.node-extra-icon
{
padding-right: @xf-paddingLarge;
float: left;
.avatar
{
.m-avatarSize(@_nodeExtra-avatarSize);
}
}
.node-title
{
margin: 0;
padding: 0;
font-size: @xf-fontSizeLarge;
font-weight: @xf-fontWeightNormal;
.node--unread &
{
font-weight: @xf-fontWeightHeavy;
}
}
.node-description
{
font-size: @xf-fontSizeSmall;
color: fade(@xf-textColorDimmed, 60%);
text-align: justify;
padding-top: 5px;
&.node-description--tooltip
{
.has-js:not(.has-touchevents) &
{
display: none;
}
}
}
.node-meta
{
font-size: @xf-fontSizeSmall;
}
.node-statsMeta
{
display: none;
@media (max-width: @_nodeList-statsCellBreakpoint)
{
display: inline;
}
}
.node-bonus
{
font-size: @xf-fontSizeSmall;
color: @xf-textColorMuted;
text-align: right;
}
.node-subNodesFlat
{
font-size: @xf-fontSizeSmall;
margin-top: .3em;
.node-subNodesLabel
{
display: none;
}
}
.node-subNodeMenu
{
display: inline;
.menuTrigger
{
color: @xf-textColorMuted;
}
}
@media (max-width: @xf-responsiveMedium)
{
.node-main
{
display: block;
width: auto;
.node--link &,
.node--page &
{
// #168882: we only display the title for these types
// so keep these as table-cells for vertical alignment
display: table-cell;
}
}
.node-extra
{
display: block;
width: auto;
margin-left: -25px;
// this gives an equivalent of medium padding between main and extra, with main still having large
margin-top: (@xf-paddingMedium - @xf-paddingLarge);
padding-top: 0;
}
.node-extra-row
{
display: inline-block;
vertical-align: top;
max-width: 100%;
}
.node-extra-icon
{
display: none;
}
.node-description
{
font-size: 14px;
margin-left: -25px;
font-family: 'Avenir Next Condensed';
}
.node-stats,
.node-subNodesFlat
{
margin-left: 0;
}
}
/* @media (max-width: @xf-responsiveNarrow)
{
.node-subNodeMenu
{
display: none;
}
} */
.subNodeLink
{
&:before
{
display: inline-block;
.m-faBase();
width: 1em;
padding-right: .3em;
text-decoration: none;
color: @xf-nodeIconReadColor;
}
&:hover:before
{
text-decoration: none;
}
&.subNodeLink--unread
{
font-weight: @xf-fontWeightHeavy;
&:before
{
color: @xf-nodeIconUnreadColor;
}
}
&.subNodeLink--forum:before,
&.subNodeLink--category:before
{
.m-faContent(@fa-var-caret-right);
}
&.subNodeLink--page:before
{
.m-faContent(@fa-var-file-alt);
}
&.subNodeLink--link:before
{
.m-faContent(@fa-var-link);
}
}
.node-subNodeFlatList
{
display: flex;
flex-flow: row wrap;
.m-listPlain();
.m-clearFix();
> li {
width: 50%;
justify-content: space-between;
&:last-child
{
margin-right: 0;
}
}
ol,
ul,
.node-subNodes
{
display: none;
}
}
.subNodeMenu
{
.m-listPlain();
ol,
ul
{
.m-listPlain();
}
.subNodeLink
{
display: block;
padding: @xf-blockPaddingV @xf-blockPaddingH;
text-decoration: none;
cursor: pointer;
&:hover
{
text-decoration: none;
background: @xf-contentHighlightBg;
}
}
li li .subNodeLink { padding-left: 1.5em; }
li li li .subNodeLink { padding-left: 3em; }
li li li li .subNodeLink { padding-left: 4.5em; }
li li li li li .subNodeLink { padding-left: 6em; }
li li li li li li .subNodeLink { padding-left: 7.5em; }
}