Versions Compared

Version Old Version 1 New Version Current
Changes made by

Michelle Cabaya

Michelle Cabaya

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Find troubleshooting and how-to articles

Live Search
spaceKeyCXTsupport
sizelarge
additionalpage excerpt
placeholderSearch for a solution
typepage

Html macro<style> ul.product-list { list-style: none; margin: 0; padding: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; width: 100%; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } ul.product-list li.product-title { margin-top: 0; margin-bottom: 20px; line-height: 60px; height: 60px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } ul.product-list li.product-tile { -webkit-box-flex: 0; -webkit-flex-grow: 0; -moz-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; -webkit-flex-basis: -webkit-calc(99.9% * .20 - (40px - 40px * .20)); -ms-flex-preferred-size: calc(99.9% * .20 - (40px - 40px * .20)); flex-basis: -moz-calc(99.9% * .20 - (40px - 40px * .20)); flex-basis: calc(99.9% * .20 - (40px - 40px * .20)); max-width: -webkit-calc(99.9% * .20 - (40px - 40px * .20)); max-width: -moz-calc(99.9% * .20 - (40px - 40px * .20)); max-width: calc(99.9% * .20 - (40px - 40px * .20)); width: -webkit-calc(99.9% * .20 - (40px - 40px * .20)); width: -moz-calc(99.9% * .20 - (40px - 40px * .20)); width: calc(99.9% * .20 - (40px - 40px * .20)); } ul.product-list li.product-tile:nth-child(1n) { margin-right: 40px; margin-left: 0; } ul.product-list li.product-tile a { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; width: 100%; padding: 10px 10px 10px 60px; color: #42526E; font-weight: normal; font-size: 14px; line-height: 40px; position: relative; } ul.product-list li.product-tile a:before { display: block; height: 40px; width: 40px; position: absolute; left: 10px; top: -webkit-calc(50% - 20px); top: -moz-calc(50% - 20px); top: calc(50% - 20px); background: #DFE1E6; padding: 0 2px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; content: ''; -moz-background-size: 40px; background-size: 40px; background-position: center; background-repeat: no-repeat; } ul.product-list li.product-tile.product-tile-nextstop-mobile a:before { background-image: url(https://media.cxtsoftware.com/ProductLogos/logos/nextstop_v1.png); } ul.product-list li.product-tile.product-tile-rapidship a:before { background-image: url(https://media.cxtsoftware.com/ProductLogos/logos/rapidship_v1.png); } ul.product-list li.product-tile.product-tile-x-dispatch-cloud a:before { background-image: url(https://media.cxtsoftware.com/ProductLogos/logos/xdcloud_v1.png); } ul.product-list li.product-tile.product-tile-x-dispatch a:before { background-image: url(https://media.cxtsoftware.com/ProductLogos/logos/xdispatch_v1.png); } ul.product-list li.product-tile.product-tile-x-internet a:before { background-image: url(https://media.cxtsoftware.com/ProductLogos/logos/xinternet_v1.png); } ul.product-list li.product-tile.product-tile-x-route a:before { background-image: url(https://media.cxtsoftware.com/ProductLogos/logos/xroute_v1.png); } ul.product-list li.product-tile.product-tile-x-stream a:before { background-image: url(https://media.cxtsoftware.com/ProductLogos/logos/xstream_v1.png); } ul.product-list li.product-tile.product-tile-x-tracking a:before { background-image: url(https://media.cxtsoftware.com/ProductLogos/logos/xtracking_v1.png); } </style> <ul class="product-list"> <li class="product-tile product-tile-x-dispatch"><a href="https://cxtsoftware.atlassian.net/wiki/spaces/CXTsupport/pages/209289217/X+Dispatch">X Dispatch</a></li> <li class="product-tile product-tile-x-dispatch-cloud"><a href="https://cxtsoftware.atlassian.net/wiki/spaces/CXTsupport/pages/205783178/X+Dispatch+Cloud">X Dispatch Cloud</a></li> <li class="product-tile product-tile-rapidship"><a href="https://cxtsoftware.atlassian.net/wiki/spaces/CXTsupport/pages/202997821">Rapidship</a></li> <li class="product-tile product-tile-nextstop-mobile"><a href="https://cxtsoftware.atlassian.net/wiki/spaces/CXTsupport/pages/982450717">Nextstop</a></li> <li class="product-tile product-tile-x-internet"><a href="https://cxtsoftware.atlassian.net/wiki/spaces/CXTsupport/pages/206209114/X+Internet">X Internet</a></li> <li class="product-tile product-tile-x-tracking"><a href="https://cxtsoftware.atlassian.net/wiki/spaces/CXTsupport/pages/206209118/X+Tracking">X Tracking</a></li> <li class="product-tile product-tile-x-stream"><a href="https://cxtsoftware.atlassian.net/wiki/spaces/CXTsupport/pages/205750338/X+Stream">X Stream</a></li> <li class="product-tile product-tile-x-route"><a href="https://cxtsoftware.atlassian.net/wiki/spaces/CXTsupport/pages/206209122/X+Route">X Route</a></li> </ul>
Page Tree
root@self