MediaWiki:Gadget-CurrencyConverter.css: различия между версиями

Нет описания правки
Нет описания правки
 
(не показано 5 промежуточных версий этого же участника)
Строка 1: Строка 1:
/* JavaScript: https://wiki.demovio.love/MediaWiki:Gadget-CurrencyConverter.js */
#currency-converter-root {
#currency-converter-root {
   display: flex;
   display: flex;
  flex-wrap: wrap;
   gap: 8px;
   gap: 8px;
}.convert.svelte-pswajn {
}.convert.svelte-1rrj40a {
   display: flex;
   display: flex;
  flex-wrap: wrap;
   align-items: center;
   align-items: center;
   gap: 16px;
   gap: 16px;
Строка 11: Строка 15:
   width: fit-content;
   width: fit-content;
}
}
.convert.svelte-pswajn .coins:where(.svelte-pswajn) {
html[class*=skin-theme-clientpref-night] .convert[class*=svelte] {
background-color: #202029;
}
@media (prefers-color-scheme: dark) {
html[class*=skin-theme-clientpref-os] .convert[class*=svelte] {
background-color: #202029;
}
}
 
.convert.svelte-1rrj40a .coins:where(.svelte-1rrj40a) {
   display: flex;
   display: flex;
}
}
.convert.svelte-pswajn .coins:where(.svelte-pswajn) .coin:where(.svelte-pswajn) {
.convert.svelte-1rrj40a .coins:where(.svelte-1rrj40a) .coin:where(.svelte-1rrj40a) {
   display: flex;
   display: flex;
   flex-direction: column;
   flex-direction: column;
Строка 21: Строка 34:
   gap: 4px;
   gap: 4px;
}
}
.convert.svelte-pswajn .coins:where(.svelte-pswajn) .coin:where(.svelte-pswajn) input:where(.svelte-pswajn) {
.convert.svelte-1rrj40a .coins:where(.svelte-1rrj40a) .coin:where(.svelte-1rrj40a) input:where(.svelte-1rrj40a) {
   width: 24px;
   width: 24px;
   padding: 2px 0px;
   padding: 2px 0px;
Строка 27: Строка 40:
   border: 1px solid black;
   border: 1px solid black;
}
}
.convert.svelte-pswajn .coins:where(.svelte-pswajn) .coin:where(.svelte-pswajn) input.invalid:where(.svelte-pswajn) {
.convert.svelte-1rrj40a .coins:where(.svelte-1rrj40a) .coin:where(.svelte-1rrj40a) input.invalid:where(.svelte-1rrj40a) {
   border: 1px solid red;
   border: 1px solid red;
}
}
.convert.svelte-pswajn .result:where(.svelte-pswajn) {
.convert.svelte-1rrj40a .result:where(.svelte-1rrj40a) {
   font-size: 24px;
   font-size: 24px;
   font-variant-numeric: tabular-nums;
   font-variant-numeric: tabular-nums;
Строка 36: Строка 49:
   gap: 6px;
   gap: 6px;
}
}
.convert.svelte-pswajn .result:where(.svelte-pswajn) .diamonds:where(.svelte-pswajn) {
.convert.svelte-1rrj40a .result:where(.svelte-1rrj40a) .diamonds:where(.svelte-1rrj40a) {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
Строка 42: Строка 55:
}
}


.icon.svelte-pswajn {
.icon.svelte-1rrj40a {
   image-rendering: pixelated;
   image-rendering: pixelated;
}
}


.icon32px.svelte-pswajn {
.icon32px.svelte-1rrj40a {
   width: 32px;
   width: 32px;
   height: 32px;
   height: 32px;
}
}


.icon24px.svelte-pswajn {
.icon24px.svelte-1rrj40a {
   width: 24px;
   width: 24px;
   height: 24px;
   height: 24px;
   margin-bottom: 4px;
   margin-bottom: 4px;
}.convert.svelte-mzgtwq {
}.convert.svelte-1u7m319 {
   display: flex;
   display: flex;
  flex-wrap: wrap;
   align-items: center;
   align-items: center;
   gap: 16px;
   gap: 16px;
Строка 64: Строка 78:
   width: fit-content;
   width: fit-content;
}
}
.convert.svelte-mzgtwq .coins:where(.svelte-mzgtwq) {
.convert.svelte-1u7m319 .coins:where(.svelte-1u7m319) {
   display: flex;
   display: flex;
}
}
.convert.svelte-mzgtwq .coins:where(.svelte-mzgtwq) .coin:where(.svelte-mzgtwq) {
.convert.svelte-1u7m319 .coins:where(.svelte-1u7m319) .coin:where(.svelte-1u7m319) {
   display: flex;
   display: flex;
   flex-direction: column;
   flex-direction: column;
Строка 74: Строка 88:
   gap: 4px;
   gap: 4px;
}
}
.convert.svelte-mzgtwq .coins:where(.svelte-mzgtwq) .coin:where(.svelte-mzgtwq) .result:where(.svelte-mzgtwq) {
.convert.svelte-1u7m319 .coins:where(.svelte-1u7m319) .coin:where(.svelte-1u7m319) .result:where(.svelte-1u7m319) {
   font-size: 24px;
   font-size: 24px;
   font-variant-numeric: tabular-nums;
   font-variant-numeric: tabular-nums;
}
}
.convert.svelte-mzgtwq .coins:where(.svelte-mzgtwq) .coin:where(.svelte-mzgtwq) .result.bold:where(.svelte-mzgtwq) {
.convert.svelte-1u7m319 .coins:where(.svelte-1u7m319) .coin:where(.svelte-1u7m319) .result.bold:where(.svelte-1u7m319) {
   font-weight: 600;
   font-weight: 600;
}
}
.convert.svelte-mzgtwq .input:where(.svelte-mzgtwq) {
.convert.svelte-1u7m319 .input:where(.svelte-1u7m319) {
   font-size: 24px;
   font-size: 24px;
   font-variant-numeric: tabular-nums;
   font-variant-numeric: tabular-nums;
Строка 87: Строка 101:
   gap: 6px;
   gap: 6px;
}
}
.convert.svelte-mzgtwq .input:where(.svelte-mzgtwq) .diamonds:where(.svelte-mzgtwq) {
.convert.svelte-1u7m319 .input:where(.svelte-1u7m319) .diamonds:where(.svelte-1u7m319) {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   gap: 4px;
   gap: 4px;
}
}
.convert.svelte-mzgtwq .input:where(.svelte-mzgtwq) .diamonds:where(.svelte-mzgtwq) input:where(.svelte-mzgtwq) {
.convert.svelte-1u7m319 .input:where(.svelte-1u7m319) .diamonds:where(.svelte-1u7m319) input:where(.svelte-1u7m319) {
   width: 48px;
   width: 48px;
   padding: 2px 0px;
   padding: 2px 0px;
Строка 98: Строка 112:
   border: 1px solid black;
   border: 1px solid black;
}
}
.convert.svelte-mzgtwq .input:where(.svelte-mzgtwq) .diamonds:where(.svelte-mzgtwq) input.invalid:where(.svelte-mzgtwq) {
.convert.svelte-1u7m319 .input:where(.svelte-1u7m319) .diamonds:where(.svelte-1u7m319) input.invalid:where(.svelte-1u7m319) {
   border: 1px solid red;
   border: 1px solid red;
}
}


.icon.svelte-mzgtwq {
.icon.svelte-1u7m319 {
   image-rendering: pixelated;
   image-rendering: pixelated;
}
}


.icon32px.svelte-mzgtwq {
.icon32px.svelte-1u7m319 {
   width: 32px;
   width: 32px;
   height: 32px;
   height: 32px;
}
}


.icon24px.svelte-mzgtwq {
.icon24px.svelte-1u7m319 {
   width: 24px;
   width: 24px;
   height: 24px;
   height: 24px;
   margin-bottom: 4px;
   margin-bottom: 4px;
}
}