Участник:Sorell:ru/common.css — различия между версиями

Текущая версия на 04:15, 5 октября 2023

/*hangar vehicle css*/
.hv-flag {
  display:block;
  position:relative;
  background-image:url("https://wiki-cdn.lesta.ru/images/2/2f/Фон_флаги.png");
  background-position:0px 0px;
  height:100px;
  line-height:19px;
  width:160px;
  margin:0px;
  padding:0px;
  outline: 2px solid #457C12;
}
.hv-i-bons,.hv-i-base {
  position:absolute;
  right:0px;
  top:0px;
  width:160px;
  height:100px;
}
.hv-i-bons {
  background:linear-gradient(160deg,#5B188200 45%,#601A8CC0 100%);
}
.hv-i-name {
  position:absolute;
  color:white;
  text-align:right;
  font-family:WarHeliosCondC;
  font-size:14px;
  height:0px;
  line-height:14px;
}
.hv-i-name > p {
  float:right;
}
.hv-i-type-p,.hv-i-type-r {
  position:absolute;
  right:2px;
  top:66px;
  font-size:11px;
  font:normal 10px Arial,Helvetica,sans-serif;
  vertical-align:top;
}
.hv-i-type-p > p {
  color:#FEA659;
  text-shadow: #FF0000CC 0 0 5px;
}
.hv-i-type-r > p {
  color:#58B0FE;
  text-shadow: #0000FFCC 0 0 5px;
}
.hv-i-icon {
  position:absolute;
  left:1px;
  top:0px;
}
.hv-i-lvl {
  position:absolute;
  left:20px;
  top:3px;
}
.hv-i-role {
  position:absolute;
  right:5px;
  top:5px;
}
/*tank page css*/
.tankpagehead {
  display:grid;
  grid-auto-columns:1fr;
  grid-auto-rows:1fr;
  grid-template-columns:160px 1fr 1fr;
  grid-template-rows:1fr auto;
  gap:0px 0px;
  grid-template-areas:"tph-hangar tph-desc tph-desc"
    "tph-spec tph-spec tph-spec";
}
.tph-hangar {
  grid-area:tph-hangar;
  height:100px;
  width:160px;
  margin:0px;
  padding:0px;
  background-color:#FF0000;
}
.tph-desc {
  grid-area:tph-desc;
  background-color:#FFFFFF;
}

/*item slot css*/
.cellitem {
  display:inline-block;
  position:relative;
  width:54px;
  height:48px;
  padding:0px;
  margin:0px;
  vertical-align:middle;
  text-align:center;
}
.cellitem>div {
  position:absolute;
  background-color:transparent;
  text-shadow:black 1px 1px 0,black -1px -1px 0,black -1px 1px 0,black 1px -1px 0;
  font:600 13px "Helvetica";
  color:#EEEEEE;
}
.cell-main {
  margin:0px;
  padding:0px;
  width:48px;
  height:48px;
  border-radius:3px;
}
.cell-out {
  background-image:url("https://wiki-cdn.lesta.ru/images/a/a1/Cellbg.png");
  width:48px;
  height:48px;
  box-shadow:0px 0px 3px 0px black;
  opacity:0.8;
}
.cell-in {
  width:100%;
  height:100%;
  box-shadow:0px 0px 7px 0px black inset;
  opacity:1;
}

/*vehicle slot css*/
.vs-base,.vs-prem {
  position:relative;
  display:block;
  width:124px;
  height:31px;
  margin:0px;
  padding:0px;
  border-radius:1px;
  overflow: hidden;
  white-space: nowrap;
  line-height: 19px;
}
.vs-base {
  background-color:#0A0A0FDD;
  outline:1px solid #363640DD;
}
.vs-prem {
  background:linear-gradient(90deg,#3f1b07DD 50%,#1d0e08DD 100%);
  outline:1px solid #564732E0;
}
.vs-shadow {
  position:absolute;
  box-shadow:inset 0px 0px 10px 0px #000000;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  transition:all 0.2s ease;
  background-color:#00000004;
}
.vs-base > .vs-shadow:hover {
  box-shadow:inset 0px 0px 4px 0px #FFFF0030;
  background-color:#00000000;
}
.vs-prem > .vs-shadow:hover {
  box-shadow:inset 0px 0px 4px 0px #FF000030;
  background-color:#00000000;
}
.vs-i-icon {
  position:absolute;
  top:-5px;
  left:-2px;
  width:0px;
  height:0px;
  line-height:24px;
}
.vs-i-lvl {
  position:absolute;
  top:-5px;
  left:11px;
  width:0px;
  height:0px;
  line-height:24px;
}
.vs-i-name {
  position:absolute;
  top:0px;
  left:-2px;
  width:100%;
  height:0px;
  line-height:11px;
  color:white;
  font:11px Roboto,sans-serif;
}
.vs-i-cost-c {
  position:absolute;
  top:12px;
  left:0px;
  width:100%;
  height:0px;
  line-height:9px;
  color:#EEEEEE;
  font-family:'WarHeliosCondC';
  font-size:9px;
}
.vs-i-cost-g {
  position:absolute;
  top:12px;
  left:0px;
  width:100%;
  height:0px;
  line-height:9px;
  color:#EEB064;
  font-family:'WarHeliosCondC';
  font-size:9px;
}
.vs-i-cost-e {
  position:absolute;
  top:21px;
  left:0px;
  width:100%;
  height:0px;
  line-height:9px;
  color:#DFC498;
  font-family:'WarHeliosCondC';
  font-size:9px;
}
.vs-i-cost-b {
  position:absolute;
  top:21px;
  left:0px;
  width:100%;
  height:0px;
  line-height:9px;
  color:#D29672;
  font-family:'WarHeliosCondC';
  font-size:9px;
}
.vs-i-cost-c > p,.vs-i-cost-g > p,.vs-i-cost-e > p,.vs-i-cost-b > p,.vs-i-name > p {
  float:right;
}

/*tree css*/
.tt-scroll {
  overflow-x: scroll;
  overflow-y: scroll;
  width: 100%;
  min-height: 155px;
  max-height: 496px;
  background-color: #181820;
  padding: 9px 9px 15px 9px;
  outline: 1px solid #00000020;
}
.tt-pdng, .p-pdng {
  display: flex;
  background-color:#181820;
  padding: 12px 8px;
  min-height: 100px;
}
.tt-main {
  border-collapse: collapse;
  margin: auto;
}
.tt-arrow, .tt-arrow-long {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
  max-width: 31px;
  max-height: 31px;
}
.tt-arrow-long {
  max-width: 124px;
}
.tt-main > tbody > tr {
  margin: 0px;
  padding: 0px;
  min-height: 31px;
  max-height: 31px;
  height: 31px;
}
.tt-main > tbody > tr > td {
  margin: 0px;
  padding: 0px;
  overflow: visible;
  white-space: nowrap;
  line-height: 31px;
}

.tt-main > tbody > tr > td:nth-child(even) {
  min-width: 31px;
  max-width: 31px;
  width: 31px;
}
.tt-main > tbody > tr > td:nth-child(odd) {
  min-width: 124px;
  max-width: 124px;
  width: 124px;
}

.pg-head {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "p-head p-head"
    "p-icon p-desc"
    "p-hend p-hend"
    "p-tree p-tree";
  padding: 0px;
  margin: 0px;
  /*background-color: #AAAAAA;*/
  min-width: 480px;
}

.p-head {
  grid-area: p-head;
  /*background-color: #FFCCCC;*/
  height: 50px;
  line-height: 50px;
  text-align: center;
  font: 36px "WarHeliosCondCBold",Arial,Helvetica,sans-serif;
}
.p-head img {
  vertical-align: baseline;
}
.p-icon {
  grid-area: p-icon;
  /*background-color: #CCFFCC;*/
}

.p-desc {
  grid-area: p-desc;
  /*background-color: #CCCCFF;*/
  font-family: "Roboto","Arial Narrow",Arial,sans-serif;
  font-size: 14px;
  text-indent: 14px;
}

.p-hend {
  grid-area: p-hend;
  /*background-color: #FFFFFF;*/
  display: flex;
  text-align: center;
  margin: 20px 0px;
}
.p-tree {
  display: flex;
  align-items: center;
  overflow: auto;
  text-align: center;
  grid-area: p-tree;
  /*background-color: #FFFFCC;*/
  text-align: center;
  vertical-align: middle;
}
.p-pdng {
  padding: 12px;
  max-width: 434px;
}
.p-spec {
  flex: 1;
  display:flex;
}
.info-icon {
  height: 100px;
  width: 160px;
  /*background-color: #494949;*/
  margin: 10px 5px 10px 10px;
  text-align: center;
  line-height: 100px;
}
.info-desc {
  min-height: 100px;
  background-color: #FFFFFF90;
  margin: 10px 10px 10px 5px;
  box-sizing: border-box;
  padding: 7px 7px 3px;
  outline: 1px solid #AAAAAAAA;
}
.info-inflex {
  /* outline: red solid 1px; */
  flex-grow: 1;
  padding: 6px 0px;
  font: 36px "WarHeliosCondCBold",Arial,Helvetica,sans-serif;
  display: flex;
  line-height: 48px;
  justify-content: center;
}
.info-inflex-line {
  display: inline-block;
  border-left: dashed #808080 1.5px;
  text-align: left;
  height: 48px;
  padding-left: 6px;
  margin-left: 4px;
}

/*module list css*/







/*TEST*/
.b-main-wrp {
  max-width: none;
}


.list-item {
  display: none;
}
.list-item.l-active {
  display: block;
}
.mt-main-std {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  align-items: baseline;
  text-align: center;
}
.mt-tab-std {
  color: #436373;
  border-bottom: 1px dashed;
  font-size: 11px;
  padding: 1px 7px;
  margin: 0px 4px;
  width: fit-content;
  height: fit-content;
  cursor: pointer;
}
.mt-tab-std.t-active {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAdCAYAAABrAQZpAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAD1JREFUeNpsjdsJADAIA6PLdz0nMtViH0L9kMsFFGY2VESojEmCAvAkT6q4HXu71s+9RaOK8eze43GcAgwAIO4mEwgOuuAAAAAASUVORK5CYII=)
    repeat-x 0 0;
  background: url(https://wiki.lesta.ru/skins/globalwiki/css/../images/ug/b-switch.png?2022-10-24T19:00:00Z)
    repeat-x 0 0;
  box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.2);
  border: 1px solid;
  border-color: #f6f6f6;
  border-color: rgba(255, 255, 255, 0.9);
  border-radius: 1px;
  line-height: 17px;
  vertical-align: top;
  color: #383838;
  font-weight: bold;
  font-size: 11px;
  border: 0;
  width: fit-content;
  height: fit-content;
  cursor: default;
}




.moduletab {
  display: block;
  width: 200px;
  height: 46px;
  border-top: #197DEB 4px solid;
  background-color: #CCCCCC;
}

.moduletab:not(.t-active) {
  border-top: 0px;
  background-color: #808080;
  box-shadow: inset 0px -3px 3px #808080;
}

.modulemain {
  background-color: #CCCCCC;
  box-shadow: black 3px 3px 15px;
  padding: 5px;
}

.mim-main {
  display: flex;
}
.mim-tabs {
  width: 200px;
}
.mim-tab {
  height: 60px;
  background-color: #808080;
  border-left: #808080 4px solid;
}
.mim-tab.t-active {
  background-color: white;
  border-left: #197DEB 4px solid;
}
.mim-list {
  background-color: white;
  flex: 1;
}


.ttx-table {
  color: #8A897C;
  line-height: 24px;
  font: 14px Arial, "Helvetica CY", Helvetica, sans-serif;
  width: 500px;
  margin: 0px;
  padding: 0px;
}
.ttx-table > tbody > tr {
  height: 24px;
  border-bottom: 1px solid #26231B;
}
.ttx-table > tbody > tr > td {
  box-sizing: border-box;
  padding: 0px 6px;
  vertical-align: middle;
}
.ttx-table > tbody > tr > td > img {
  margin-left: 3px;
}
.ttx-table > tbody > tr > td > span {
  font-size: 11px;
  color: #606055;
  float: right;
}
.ttx-table > tbody > tr:first-child {
  border-top: 1px solid #26231B;
}
.ttx-table > tbody > tr:nth-child(even) {
  background-color: #1A1811;
}
.ttx-table > tbody > tr:nth-child(odd) {
  background-color: #1D1B14;
}

.ta-os-main {
  padding: 15px 5px 15px 0px;
  border-collapse: collapse;
  margin-bottom: 8px;
}
.ta-os-main > tbody > tr > td:not(.ta-os-img) {
  padding: 0px 15px 0px 5px;
}
.ta-os-main:last-child {
  margin-bottom: 0px;
}
.ta-os-img {
  border-right: 2px black solid;
  text-align: center;
  vertical-align: middle;
  height: 64px;
  width: 64px;
  aspect-ratio: 1 / 1;
}
.ta-os-head {
  border-bottom: 1px black solid;
  vertical-align: bottom;
  height: 20px;
}

.crew-table {
  display: flex;
  flex-direction: column;
  float: right;
}
.crew-str {
  display: flex;
  flex-wrap: nowrap;
}
.crew-slot {
  display: block;
  box-sizing: border-box;
  background-color: black;
  height: 52px;
  width: 52px;
  padding: 4px;
}