Difference between revisions of "User:Valento/vector.css"

From Final Fantasy XIV Online Wiki
Jump to navigation Jump to search
m
 
(62 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* General */
/* DEBUG
div.ffxiv-action-icon > div { border: 1px dashed green; }
div.ffxiv-action-icon > div img { border: 1px dashed red; }
div.ffxiv-action-icon > div:after { border: 1px dashed blue; }
*/


p img {
/** ACTION ICONS **/
     margin: 0;
div.ffxiv-action-icon {
     position: relative;
    display: inline-block;
}
}


img {
/* Grey background */
     border: none;
div.ffxiv-action-icon > div {
     position: relative;
    width: 48px;
    height: 48px;
    display: inline-block;
    background: url(/mediawiki/images/2/2b/Action_background.png) no-repeat 4px 2px;
    -moz-background-size: 40px 40px;
    -o-background-size: 40px 40px;
    -webkit-background-size: 40px 40px;
    background-size: 40px 40px;
     vertical-align: middle;
     vertical-align: middle;
}
}


p, ul, ol, dl {
/* Icon */
    margin-top: 0.7692307692em;
div.ffxiv-action-icon > div img {
    margin-bottom: 0.7692307692em;
     position: absolute;
    line-height: 1.5384615385em;
     top: 2px;
}
     left: 50%;
 
     margin-left: -20px;
.infobox-n .clear, .nav .clear, .recipe-box .clear {
     display: block;
    height: 5px;
}
 
/* Infobox specific */
 
div.infobox-n .heading {
     font-weight: 700;
     background-image: url(https://ffxiv.consolegameswiki.com/mediawiki/images/b/b3/Box_overlay.png) !important;
    text-align: center;
     border: 1px solid rgba(0,0,0,0.25);
     border-bottom-width: 0;
     position: relative;
     z-index: 1;
     z-index: 1;
    font-size-adjust: .52;
    margin: -1px -1px 5px!important;
}
div.infobox-n {
    float: right;
    position: relative;
    width: 250px;
    background: #FFF;
    font-size: .923em;
    border: 1px solid #AAA;
    margin: 0 0 1em 1em;
    padding: 0;
}
}


div.infobox-n .icon {
/* Glassy overlay */
     float: right;
div.ffxiv-action-icon > div:after {
     position: relative;
     content: "";
    background: url(/mediawiki/images/d/d9/Action_overlay_glassy.png) no-repeat;
    width: 48px;
    height: 48px;
    display: block;
     position: absolute;
    top: 0;
    left: 0;
     z-index: 2;
     z-index: 2;
    width: auto;
    margin: 5px;
}
div.infobox-n.skill .icon > div {
    border: 2px solid #111;
}
div.infobox-n.skill .heading {
    background: #444;
}
div.infobox-n.elementalist .heading {
    background-color: #c00!important;
}
div.infobox-n .statistics {
    text-align: center;
    margin: 0 8px;
}
div.infobox-n .wrapper {
    clear: both;
    padding: 0;
}
div.nav dl, div.infobox-n dl {
    margin: 10px 0;
}
div.infobox-n dd {
    float: left;
    width: 125px;
    font-weight: 400;
    border-left: 2px solid #999;
    margin: 0;
    padding: 2px 7px;
}
div.infobox-n dt {
    float: left;
    text-align: right;
    width: 78px;
    line-height: 1em;
    font-weight: 700;
    clear: left;
    border-right: 2px solid #999;
    margin: 0 -2px 0 0;
    padding: 2px 8px 2px 3px;
}
div.infobox-n.skill dd, div.infobox-n.skill dt {
    border-color: #999;
}
div.infobox-n.elementalist dd, div.infobox-n.elementalist dt {
    border-color: #c00!important;
}
/* Table */
.table {
  border:0 solid;
  border-collapse:collapse;
  border-spacing:0;
  font-size:.9230769231em;
  text-align:left;
  clear:none;
  position:relative;
  display:inline-block;
  vertical-align:top;
  margin:10px 0;
  padding:0;
}
/* make table captions bold */
.table > caption { font-weight: bold }
/* this is a hack to add borders to IE8- */
.table > thead, .table > tbody { border:0 solid #aaa\0/ }
.table tr {
  border:1px solid #aaa\0/;
  text-align:left;
  border-color:#AAA;
}
/* and this removes them for IE9+ */
:root .table tr { border-top-width:0; border-bottom-width:0; }
.table > * > tr > :first-child { border-left:1px solid #AAA; }
.table > * > tr > :last-child { border-right:1px solid #AAA; }
.table > tbody > tr:last-child,
.table > tbody > tr:last-child > *,
.table > tfoot > tr:last-child > *,
.table > caption { border-bottom:1px solid #AAA; }
.table > tbody:first-child > tr:first-child > *,
.table > tbody > tr.heading > *,
.table > thead > tr:first-child > * {
  background-image:url("/images/c/cc/Infobox_header_overlay.png");
  background-color:#EEE;
  border-color:#AAA;
  padding:.5em;
}
}


.table > tbody > tr > th,
/* Icon link */
.table > tbody > tr > td,
div.ffxiv-action-icon > a {
.table > tfoot > tr > th {
    width: 40px;
  line-height:1.667em;
    height: 40px;
  padding:.25em .5em;
    position: absolute;
    top: 0;
    z-index: 3;
    left: 2px;
    text-decoration: none;
}
}


.table tr > th, .table[class*=center] tr { text-align:center; }
/* Mid-size */
.table[class*=left] tr { text-align:left; }
div.ffxiv-action-icon.mid > div {
.table[class*=right] tr { text-align:right; }
    width: 38px;
.table[class*=middle] tr { vertical-align:middle; }
    height: 38px;
.table[class*=top] tr { vertical-align:top; }
    background-size: 30px 30px;
.table[class*=bottom] tr { vertical-align:bottom; }
 
.table > :first-child > tr:first-child,
.table > tbody > tr.heading {
  background-color:#EEE;
  border:1px solid #aaa!important;
}
}
 
div.ffxiv-action-icon.mid > div img {
.table > tbody > tr > th, .table > tfoot > tr > th {
    top: 1px;
  background-color:#E7E7E7;
    left: 60%;
  border-color:#AAA;
}
}
 
div.ffxiv-action-icon.mid > div:after {
.table > tbody > tr:nth-child(odd) {
    width: 36px;
  background-color:#F3F3F3;
    height: 36px;
  border-color:#AAA;
    background-size: 36px 36px;
}
}
 
div.ffxiv-action-icon.mid > a {
.table > tbody,
    width: 30px;
.table > tbody > tr.heading,
    height: 30px;
.table > tbody > tr > [rowspan],
.table > tbody > tr > [colspan] { border:1px solid #AAA; }
 
.table > :first-child > tr:first-child + tr [rowspan],
.table > :first-child > tr:first-child + tr [colspan] { border-top-width:0; }
 
.table .line,
.table .line-bottom {
  border-bottom-width:1px!important;
  border-bottom-style:solid;
}
}


.table .line-top {
/* Small-size */
  border-top-width:1px!important;
div.ffxiv-action-icon.small > div {
  border-top-style:solid;
    width: 28px;
  border-top-color:#AAA;
    height: 24px;
    background-size: 18px 20px;
}
}
 
div.ffxiv-action-icon.small > div img {
.table .line-left {
    top: 1px;
  border-left-width:1px!important;
    left: 78%;
  border-left-style:solid;
  border-left-color:#AAA;
}
}
 
div.ffxiv-action-icon.small > div:after {
.table .line-right {
    width: 24px;
  border-right-width:1px!important;
    height: 24px;
  border-right-style:solid;
    background-size: 24px 24px;
  border-right-color:#AAA;
}
}
 
div.ffxiv-action-icon.small > a {
.table table {
    width: 20px;
  background-color:transparent;
    height: 20px;
  padding:0;
  margin:0;
}
}
/* any */
  .table.any > :first-child > tr:first-child,
  .table.any > tbody > tr.heading,
  .table.any > :first-child > tr:first-child > *,
  .table.any > tbody > tr.heading > * {
    background-color:#888 !important;
    border-color:#6D6D6D !important;
  }
  .table.any > tbody > tr > th,
  .table.any > tfoot > tr > th,
  .table.any > thead > tr > th,
  table.table > tbody > tr.any > th {
    background-color:#CCC;
    border-color:#AAA;
  }
  .table.any > tbody > tr:nth-child(odd),
  .table > tbody > tr.any:nth-child(odd) {
    background-color:#EEE;
  }

Latest revision as of 19:37, 26 June 2017

/* DEBUG
div.ffxiv-action-icon > div { border: 1px dashed green; }
div.ffxiv-action-icon > div img { border: 1px dashed red; }
div.ffxiv-action-icon > div:after { border: 1px dashed blue; }
*/

/** ACTION ICONS **/
div.ffxiv-action-icon {
    position: relative;
    display: inline-block;
}

/* Grey background */
div.ffxiv-action-icon > div {
    position: relative;
    width: 48px;
    height: 48px;
    display: inline-block;
    background: url(/mediawiki/images/2/2b/Action_background.png) no-repeat 4px 2px;
    -moz-background-size: 40px 40px;
    -o-background-size: 40px 40px;
    -webkit-background-size: 40px 40px;
    background-size: 40px 40px;
    vertical-align: middle;
}

/* Icon */
div.ffxiv-action-icon > div img {
    position: absolute;
    top: 2px;
    left: 50%;
    margin-left: -20px;
    display: block;
    z-index: 1;
}

/* Glassy overlay */
div.ffxiv-action-icon > div:after {
    content: "";
    background: url(/mediawiki/images/d/d9/Action_overlay_glassy.png) no-repeat;
    width: 48px;
    height: 48px;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

/* Icon link */
div.ffxiv-action-icon > a {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    z-index: 3;
    left: 2px;
    text-decoration: none;
}

/* Mid-size */
div.ffxiv-action-icon.mid > div {
    width: 38px;
    height: 38px;
    background-size: 30px 30px;
}
div.ffxiv-action-icon.mid > div img {
    top: 1px;
    left: 60%;
}
div.ffxiv-action-icon.mid > div:after {
    width: 36px;
    height: 36px;
    background-size: 36px 36px;
}
div.ffxiv-action-icon.mid > a {
    width: 30px;
    height: 30px;
}

/* Small-size */
div.ffxiv-action-icon.small > div {
    width: 28px;
    height: 24px;
    background-size: 18px 20px;
}
div.ffxiv-action-icon.small > div img {
    top: 1px;
    left: 78%;
}
div.ffxiv-action-icon.small > div:after {
    width: 24px;
    height: 24px;
    background-size: 24px 24px;
}
div.ffxiv-action-icon.small > a {
    width: 20px;
    height: 20px;
}

Retrieved from "https://ffxiv.consolegameswiki.com/mediawiki/index.php?title=User:Valento/vector.css&oldid=126375"