diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/en/table-key.html | 6 | ||||
| -rw-r--r-- | src/pt/table-key.html | 6 | ||||
| -rw-r--r-- | src/style.css | 65 |
3 files changed, 77 insertions, 0 deletions
diff --git a/src/en/table-key.html b/src/en/table-key.html index 0868211..5c9c957 100644 --- a/src/en/table-key.html +++ b/src/en/table-key.html @@ -11,6 +11,12 @@ <td><div class=have-nifc></div></td> <td>In my collection (NIFC)</td> </tr> + <!-- IF-COINS --> + <tr> + <td><div class=have-proof></div></td> + <td>In my collection (Proof)</td> + </tr> + <!-- FI-COINS --> <tr> <td><div class=unknown></div></td> <td>Data missing</td> diff --git a/src/pt/table-key.html b/src/pt/table-key.html index eaf6ac4..05a4ea6 100644 --- a/src/pt/table-key.html +++ b/src/pt/table-key.html @@ -11,6 +11,12 @@ <td><div class=have-nifc></div></td> <td>Na minha coleção (NIFC)</td> </tr> + <!-- IF-COINS --> + <tr> + <td><div class=have-proof></div></td> + <td>Na minha coleção (Prova)</td> + </tr> + <!-- FI-COINS --> <tr> <td><div class=unknown></div></td> <td>Faltam dados</td> diff --git a/src/style.css b/src/style.css index 4868b3f..00b95ef 100644 --- a/src/style.css +++ b/src/style.css @@ -435,6 +435,69 @@ main section { .not-minted { background-color: black; } .unknown { background-color: grey; } .error { background-color: red; } +.have-proof { + background-color: #5DBB63; + position: relative; +} + +.have-proof:after { + content: ''; + top: 0; + left: 0; + width: 100%; + height: 100%; + position: absolute; + z-index: 1; + animation: slide 6s infinite 0s; + + background: -moz-linear-gradient( + left, + rgba(255, 255, 255, 0.0) 0%, + rgba(255, 255, 255, 0.4) 50%, + rgba(255, 255, 255, 0.0) 100% + ); + background: -webkit-linear-gradient( + left, + rgba(255, 255, 255, 0.0) 0%, + rgba(255, 255, 255, 0.4) 50%, + rgba(255, 255, 255, 0.0) 100% + ); + background: -ms-linear-gradient( + left, + rgba(255, 255, 255, 0.0) 0%, + rgba(255, 255, 255, 0.4) 50%, + rgba(255, 255, 255, 0.0) 100% + ); + background: -o-linear-gradient( + left, + rgba(255, 255, 255, 0.0) 0%, + rgba(255, 255, 255, 0.4) 50%, + rgba(255, 255, 255, 0.0) 100% + ); + background: linear-gradient( + to right, + rgba(255, 255, 255, 0.0) 0%, + rgba(255, 255, 255, 0.4) 50%, + rgba(255, 255, 255, 0.0) 100% + ); + background: -webkit-gradient( + linear, left top, right top, + color-stop( 0%, rgba(255, 255, 255, 0.0)), + color-stop( 50%, rgba(255, 255, 255, 0.4)), + color-stop(100%, rgba(255, 255, 255, 0.0)) + ); + + filter: progid:DXImageTransform.Microsoft.gradient( + startColorstr="#00FFFFFF", + endColorstr="#007DB9E8", + GradientType=1 + ); +} + +@keyframes slide { + 0% { transform: translateX(-100%); } + 100% { transform: translateX(+100%); } +} #table-key { background-color: var(--secondary-color); @@ -443,6 +506,7 @@ main section { #table-key td { padding: 0; + overflow: hidden; } #table-key tr td:first-child { @@ -626,6 +690,7 @@ div .country-table:not(:first-child) { .coin-table .have, .coin-table .nifc, .coin-table .have-nifc, +.coin-table .have-proof, .coin-table .not-minted { color: black; } |