English
Personal tools
Namespaces

Variants
Actions

MediaWiki:Vector.css

From Tanki Online Wiki
Revision as of 06:33, 25 January 2018 by Impulse (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Konqueror: Click Reload or press F5
  • Opera: Clear the cache in Tools → Preferences
.tanki-control {
  display: inline-block;
  position: relative;
  overflow: visible;
  height: 26px;
  
  border: 2px solid rgba(170,170,170,0.75);
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  outline: 0 none;
  
  color: #eee;
  font-size: 1em;
  font-family: sans-serif;
  opacity: 0.9;
  -webkit-box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25);
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25);

  line-height: 1;
  padding: 0;
  margin: 0;
  box-sizing: border-box !important;
  vertical-align: top;
  background-color: #444;
  background-size: 100% 100%;
  
  -webkit-transition: all 100ms ease-out;
  -moz-transition: all 100ms ease-out;
  -o-transition: all 100ms ease-out;
  transition: all 100ms ease-out;
  -webkit-transition-property: border, opacity;
  -moz-transition-property: border, opacity;
  -o-transition-property: border, opacity;
  transition-property: border, opacity;
}

.tanki-control:focus,
.tanki-control:active {
  outline: 0 none !important;
  opacity: 0.95;
}

.tanki-control:disabled,
.tanki-control[disabled],
.tanki-control[disabled="disabled"],
.tanki-control[disabled="true"],
.tanki-control[disabled=""] {
  opacity: 0.5 !important;
  cursor: default !important;
}

select.tanki-control::-ms-value, 
select.tanki-control *::-ms-value { color: #eee !important; background-color: transparent !important; }
.tanki-control::-ms-clear { display: none !important; width: 0; height: 0; }
.tanki-control::-ms-reveal { display: none !important; width: 0; height: 0; }
.tanki-control:-webkit-autofill,
.tanki-control:-webkit-autofill:hover,
.tanki-control:-webkit-autofill:focus,
.tanki-control:-webkit-autofill:active {
  -webkit-transition: color 9999s ease-out, background-color 9999s ease-out;
  -webkit-transition-delay: 9999s;
}

input[type="text"].tanki-control,
input[type="password"].tanki-control,
input[type="number"].tanki-control {
  padding-left: 4px;
  padding-right: 4px;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxsaW5lYXJHcmFkaWVudCBpZD0iZzEiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIHN0b3AtY29sb3I9InJnYmEoODYsODYsODYsMC43OCkiLz48c3RvcCBvZmZzZXQ9Ii4wMyIgc3RvcC1jb2xvcj0icmdiYSg3MSw3MSw3MSwwLjc4KSIvPjxzdG9wIG9mZnNldD0iLjEiIHN0b3AtY29sb3I9InJnYmEoNDYsNDYsNDYsMC43OCkiLz48c3RvcCBvZmZzZXQ9Ii4xNiIgc3RvcC1jb2xvcj0icmdiYSgyOCwyOCwyOCwwLjc4KSIvPjxzdG9wIG9mZnNldD0iLjE5IiBzdG9wLWNvbG9yPSJyZ2JhKDIyLDIyLDIyLDAuNzgpIi8+PHN0b3Agb2Zmc2V0PSIuMjYiIHN0b3AtY29sb3I9InJnYmEoMTcsMTcsMTcsMC43OCkiLz48c3RvcCBvZmZzZXQ9Ii40OCIgc3RvcC1jb2xvcj0icmdiYSgyOSwyOSwyOSwwLjc5KSIvPjxzdG9wIG9mZnNldD0iLjUyIiBzdG9wLWNvbG9yPSJyZ2JhKDY4LDY4LDY4LDAuNzkpIi8+PHN0b3Agb2Zmc2V0PSIuNTUiIHN0b3AtY29sb3I9InJnYmEoNzQsNzQsNzQsMC43OSkiLz48c3RvcCBvZmZzZXQ9Ii43NCIgc3RvcC1jb2xvcj0icmdiYSg5Niw5Niw5NiwwLjgpIi8+PHN0b3Agb2Zmc2V0PSIuODciIHN0b3AtY29sb3I9InJnYmEoMTA3LDEwNywxMDcsMC44MSkiLz48c3RvcCBvZmZzZXQ9Ii45IiBzdG9wLWNvbG9yPSJyZ2JhKDExMiwxMTIsMTEyLDAuODEpIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSJyZ2JhKDExNywxMTcsMTE3LDAuODEpIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2cxKSIvPjwvc3ZnPg==');
  background-image: -moz-linear-gradient(top,rgba(86,86,86,0.78) 0%,rgba(71,71,71,0.78) 3%,rgba(46,46,46,0.78) 10%,rgba(28,28,28,0.78) 16%,rgba(22,22,22,0.78) 19%,rgba(17,17,17,0.78) 26%,rgba(29,29,29,0.79) 48%,rgba(68,68,68,0.79) 52%,rgba(74,74,74,0.79) 55%,rgba(96,96,96,0.8) 74%,rgba(107,107,107,0.81) 87%,rgba(112,112,112,0.81) 90%,rgba(117,117,117,0.81) 100%);
  background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(86,86,86,0.78)),color-stop(3%,rgba(71,71,71,0.78)),color-stop(10%,rgba(46,46,46,0.78)),color-stop(16%,rgba(28,28,28,0.78)),color-stop(19%,rgba(22,22,22,0.78)),color-stop(26%,rgba(17,17,17,0.78)),color-stop(48%,rgba(29,29,29,0.79)),color-stop(52%,rgba(68,68,68,0.79)),color-stop(55%,rgba(74,74,74,0.79)),color-stop(74%,rgba(96,96,96,0.8)),color-stop(87%,rgba(107,107,107,0.81)),color-stop(90%,rgba(112,112,112,0.81)),color-stop(100%,rgba(117,117,117,0.81)));
  background-image: -webkit-linear-gradient(top,rgba(86,86,86,0.78) 0%,rgba(71,71,71,0.78) 3%,rgba(46,46,46,0.78) 10%,rgba(28,28,28,0.78) 16%,rgba(22,22,22,0.78) 19%,rgba(17,17,17,0.78) 26%,rgba(29,29,29,0.79) 48%,rgba(68,68,68,0.79) 52%,rgba(74,74,74,0.79) 55%,rgba(96,96,96,0.8) 74%,rgba(107,107,107,0.81) 87%,rgba(112,112,112,0.81) 90%,rgba(117,117,117,0.81) 100%);
  background: -o-linear-gradient(top,rgba(86,86,86,0.78) 0%,rgba(71,71,71,0.78) 3%,rgba(46,46,46,0.78) 10%,rgba(28,28,28,0.78) 16%,rgba(22,22,22,0.78) 19%,rgba(17,17,17,0.78) 26%,rgba(29,29,29,0.79) 48%,rgba(68,68,68,0.79) 52%,rgba(74,74,74,0.79) 55%,rgba(96,96,96,0.8) 74%,rgba(107,107,107,0.81) 87%,rgba(112,112,112,0.81) 90%,rgba(117,117,117,0.81) 100%);
  background-image: -ms-linear-gradient(top,rgba(86,86,86,0.78) 0%,rgba(71,71,71,0.78) 3%,rgba(46,46,46,0.78) 10%,rgba(28,28,28,0.78) 16%,rgba(22,22,22,0.78) 19%,rgba(17,17,17,0.78) 26%,rgba(29,29,29,0.79) 48%,rgba(68,68,68,0.79) 52%,rgba(74,74,74,0.79) 55%,rgba(96,96,96,0.8) 74%,rgba(107,107,107,0.81) 87%,rgba(112,112,112,0.81) 90%,rgba(117,117,117,0.81) 100%);
  background-image: linear-gradient(to bottom,rgba(86,86,86,0.78) 0%,rgba(71,71,71,0.78) 3%,rgba(46,46,46,0.78) 10%,rgba(28,28,28,0.78) 16%,rgba(22,22,22,0.78) 19%,rgba(17,17,17,0.78) 26%,rgba(29,29,29,0.79) 48%,rgba(68,68,68,0.79) 52%,rgba(74,74,74,0.79) 55%,rgba(96,96,96,0.8) 74%,rgba(107,107,107,0.81) 87%,rgba(112,112,112,0.81) 90%,rgba(117,117,117,0.81) 100%);
}
input[type="text"].tanki-control:focus,
input[type="text"].tanki-control:active,
input[type="password"].tanki-control:focus,
input[type="password"].tanki-control:active,
input[type="number"].tanki-control:focus,
input[type="number"].tanki-control:active,
textarea.tanki-control:focus,
textarea.tanki-control:active {
  border: 2px solid rgba(190, 190, 190, 1);
}

.tanki-control:disabled:focus,
.tanki-control[disabled="disabled"]:focus,
.tanki-control[disabled="true"]:focus,
.tanki-control[disabled=""]:focus,
.tanki-control[disabled]:focus,
.tanki-control:disabled:active,
.tanki-control[disabled="disabled"]:active,
.tanki-control[disabled="true"]:active,
.tanki-control[disabled=""]:active,
.tanki-control[disabled]:active {
  border: 2px solid #d85c5c !important;
}

input[type="submit"].tanki-control,
input[type="button"].tanki-control,
button.tanki-control,
select.tanki-control {
  cursor: pointer;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxsaW5lYXJHcmFkaWVudCBpZD0iZzEiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIHN0b3AtY29sb3I9InJnYmEoMTE3LDExNywxMTcsMC44MSkiLz48c3RvcCBvZmZzZXQ9Ii4xIiBzdG9wLWNvbG9yPSJyZ2JhKDExMiwxMTIsMTEyLDAuOCkiLz48c3RvcCBvZmZzZXQ9Ii4xMyIgc3RvcC1jb2xvcj0icmdiYSgxMDcsMTA3LDEwNywwLjgpIi8+PHN0b3Agb2Zmc2V0PSIuMjYiIHN0b3AtY29sb3I9InJnYmEoOTYsOTYsOTYsMC43OSkiLz48c3RvcCBvZmZzZXQ9Ii4zOSIgc3RvcC1jb2xvcj0icmdiYSg4MCw4MCw4MCwwLjc4KSIvPjxzdG9wIG9mZnNldD0iLjQyIiBzdG9wLWNvbG9yPSJyZ2JhKDc2LDc2LDc2LDAuNzcpIi8+PHN0b3Agb2Zmc2V0PSIuNDUiIHN0b3AtY29sb3I9InJnYmEoNzQsNzQsNzQsMC43NykiLz48c3RvcCBvZmZzZXQ9Ii40OCIgc3RvcC1jb2xvcj0icmdiYSg2OCw2OCw2OCwwLjc2KSIvPjxzdG9wIG9mZnNldD0iLjUyIiBzdG9wLWNvbG9yPSJyZ2JhKDI5LDI5LDI5LDAuNzIpIi8+PHN0b3Agb2Zmc2V0PSIuNjUiIHN0b3AtY29sb3I9InJnYmEoMjAsMjAsMjAsMC43MikiLz48c3RvcCBvZmZzZXQ9Ii42OCIgc3RvcC1jb2xvcj0icmdiYSgxOCwxOCwxOCwwLjcyKSIvPjxzdG9wIG9mZnNldD0iLjc0IiBzdG9wLWNvbG9yPSJyZ2JhKDE3LDE3LDE3LDAuNzIpIi8+PHN0b3Agb2Zmc2V0PSIuODEiIHN0b3AtY29sb3I9InJnYmEoMjIsMjIsMjIsMC43MikiLz48c3RvcCBvZmZzZXQ9Ii44NCIgc3RvcC1jb2xvcj0icmdiYSgyOCwyOCwyOCwwLjcyKSIvPjxzdG9wIG9mZnNldD0iLjkiIHN0b3AtY29sb3I9InJnYmEoNDYsNDYsNDYsMC43NCkiLz48c3RvcCBvZmZzZXQ9Ii45NyIgc3RvcC1jb2xvcj0icmdiYSg3MSw3MSw3MSwwLjc3KSIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0icmdiYSg4Niw4Niw4NiwwLjc4KSIvPjwvbGluZWFyR3JhZGllbnQ+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNnMSkiLz48L3N2Zz4=');
  background-image: -moz-linear-gradient(top,rgba(117,117,117,0.81) 0%,rgba(112,112,112,0.8) 10%,rgba(107,107,107,0.8) 13%,rgba(96,96,96,0.79) 26%,rgba(80,80,80,0.78) 39%,rgba(76,76,76,0.77) 42%,rgba(74,74,74,0.77) 45%,rgba(68,68,68,0.76) 48%,rgba(29,29,29,0.72) 52%,rgba(20,20,20,0.72) 65%,rgba(18,18,18,0.72) 68%,rgba(17,17,17,0.72) 74%,rgba(22,22,22,0.72) 81%,rgba(28,28,28,0.72) 84%,rgba(46,46,46,0.74) 90%,rgba(71,71,71,0.77) 97%,rgba(86,86,86,0.78) 100%);
  background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(117,117,117,0.81)),color-stop(10%,rgba(112,112,112,0.8)),color-stop(13%,rgba(107,107,107,0.8)),color-stop(26%,rgba(96,96,96,0.79)),color-stop(39%,rgba(80,80,80,0.78)),color-stop(42%,rgba(76,76,76,0.77)),color-stop(45%,rgba(74,74,74,0.77)),color-stop(48%,rgba(68,68,68,0.76)),color-stop(52%,rgba(29,29,29,0.72)),color-stop(65%,rgba(20,20,20,0.72)),color-stop(68%,rgba(18,18,18,0.72)),color-stop(74%,rgba(17,17,17,0.72)),color-stop(81%,rgba(22,22,22,0.72)),color-stop(84%,rgba(28,28,28,0.72)),color-stop(90%,rgba(46,46,46,0.74)),color-stop(97%,rgba(71,71,71,0.77)),color-stop(100%,rgba(86,86,86,0.78)));
  background-image: -webkit-linear-gradient(top,rgba(117,117,117,0.81) 0%,rgba(112,112,112,0.8) 10%,rgba(107,107,107,0.8) 13%,rgba(96,96,96,0.79) 26%,rgba(80,80,80,0.78) 39%,rgba(76,76,76,0.77) 42%,rgba(74,74,74,0.77) 45%,rgba(68,68,68,0.76) 48%,rgba(29,29,29,0.72) 52%,rgba(20,20,20,0.72) 65%,rgba(18,18,18,0.72) 68%,rgba(17,17,17,0.72) 74%,rgba(22,22,22,0.72) 81%,rgba(28,28,28,0.72) 84%,rgba(46,46,46,0.74) 90%,rgba(71,71,71,0.77) 97%,rgba(86,86,86,0.78) 100%);
  background-image: -o-linear-gradient(top,rgba(117,117,117,0.81) 0%,rgba(112,112,112,0.8) 10%,rgba(107,107,107,0.8) 13%,rgba(96,96,96,0.79) 26%,rgba(80,80,80,0.78) 39%,rgba(76,76,76,0.77) 42%,rgba(74,74,74,0.77) 45%,rgba(68,68,68,0.76) 48%,rgba(29,29,29,0.72) 52%,rgba(20,20,20,0.72) 65%,rgba(18,18,18,0.72) 68%,rgba(17,17,17,0.72) 74%,rgba(22,22,22,0.72) 81%,rgba(28,28,28,0.72) 84%,rgba(46,46,46,0.74) 90%,rgba(71,71,71,0.77) 97%,rgba(86,86,86,0.78) 100%);
  background-image: -ms-linear-gradient(top,rgba(117,117,117,0.81) 0%,rgba(112,112,112,0.8) 10%,rgba(107,107,107,0.8) 13%,rgba(96,96,96,0.79) 26%,rgba(80,80,80,0.78) 39%,rgba(76,76,76,0.77) 42%,rgba(74,74,74,0.77) 45%,rgba(68,68,68,0.76) 48%,rgba(29,29,29,0.72) 52%,rgba(20,20,20,0.72) 65%,rgba(18,18,18,0.72) 68%,rgba(17,17,17,0.72) 74%,rgba(22,22,22,0.72) 81%,rgba(28,28,28,0.72) 84%,rgba(46,46,46,0.74) 90%,rgba(71,71,71,0.77) 97%,rgba(86,86,86,0.78) 100%);
  background-image: linear-gradient(to bottom,rgba(117,117,117,0.81) 0%,rgba(112,112,112,0.8) 10%,rgba(107,107,107,0.8) 13%,rgba(96,96,96,0.79) 26%,rgba(80,80,80,0.78) 39%,rgba(76,76,76,0.77) 42%,rgba(74,74,74,0.77) 45%,rgba(68,68,68,0.76) 48%,rgba(29,29,29,0.72) 52%,rgba(20,20,20,0.72) 65%,rgba(18,18,18,0.72) 68%,rgba(17,17,17,0.72) 74%,rgba(22,22,22,0.72) 81%,rgba(28,28,28,0.72) 84%,rgba(46,46,46,0.74) 90%,rgba(71,71,71,0.77) 97%,rgba(86,86,86,0.78) 100%);
}

input[type="submit"].tanki-control,
input[type="button"].tanki-control,
button.tanki-control {
  padding-left: 6px;
  padding-right: 6px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

input[type="submit"].tanki-control:active,
input[type="button"].tanki-control:active,
button.tanki-control:active {
  opacity: 0.85;
}

select.tanki-control {
  padding-left: 2px;
  padding-right: 2px;
}

select.tanki-control option:disabled,
select.tanki-control option[disabled="disabled"],
select.tanki-control option[disabled="true"],
select.tanki-control option[disabled=""],
select.tanki-control option[disabled] {
  color: #777;
}

select.tanki-control option[selected="selected"],
select.tanki-control option[selected="true"],
select.tanki-control option[selected=""],
select.tanki-control option[selected] {
  background-color: transparent !important;
}

textarea.tanki-control {
  resize: none;
  min-height: 80px;
  padding: 6px;
  overflow: auto !important;
}

input[type="checkbox"].tanki-control,
input[type="radio"].tanki-control {
  width: 20px;
  height: 20px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 0;
  background: none;
}

input[type="text"].tanki-control::-webkit-input-placeholder,
input[type="text"].tanki-control::-moz-placeholder,
input[type="text"].tanki-control:-moz-placeholder,
input[type="text"].tanki-control:-ms-input-placeholder,
input[type="text"].tanki-control::placeholder,
textarea.tanki-control::-webkit-input-placeholder,
textarea.tanki-control::-moz-placeholder,
textarea.tanki-control:-moz-placeholder,
textarea.tanki-control:-ms-input-placeholder,
textarea.tanki-control::placeholder {
  color: #aaa;
  opacity: 1;
  transition: opacity 100ms ease;
}

input[type="text"].tanki-control:focus::-webkit-input-placeholder,
input[type="text"].tanki-control:focus::-moz-placeholder,
input[type="text"].tanki-control:focus:-moz-placeholder,
input[type="text"].tanki-control:focus:-ms-input-placeholder,
input[type="text"].tanki-control:focus::placeholder,
textarea.tanki-control:focus::-webkit-input-placeholder,
textarea.tanki-control:focus::-moz-placeholder,
textarea.tanki-control:focus:-moz-placeholder,
textarea.tanki-control:focus:-ms-input-placeholder,
textarea.tanki-control::placeholder {
  opacity: 0;
  transition: opacity 100ms ease;
}