diff --git a/dist/script.js b/dist/script.js index 42dfb59..3e7851b 100644 --- a/dist/script.js +++ b/dist/script.js @@ -250,6 +250,10 @@ function loadCurrentVersion() { blocksElement.appendChild(blocksLegendElement); blocksLegendElement.innerHTML = 'Blocks'; + var blocksContentElement = document.createElement('div'); + blocksElement.appendChild(blocksContentElement); + blocksContentElement.classList.add('fieldset-content'); + var infoUnobtainableElement = document.getElementById('info-unobtainable'); var infoMigratableElement = document.getElementById('info-migratable'); var infoRemovedElement = document.getElementById('info-removed'); @@ -258,7 +262,7 @@ function loadCurrentVersion() { checkEntries(blocks, infoMigratableElement, "isObtainableByMigration"); checkEntries(blocks, infoRemovedElement, "isRemoved"); - loadEntries(blocks, blocksElement, "blocks"); + loadEntries(blocks, blocksContentElement, "blocks"); var items = versions[id].items; @@ -271,6 +275,10 @@ function loadCurrentVersion() { itemsElement.appendChild(itemsLegendElement); itemsLegendElement.innerHTML = 'Items'; + var itemsContentElement = document.createElement('div'); + itemsElement.appendChild(itemsContentElement); + itemsContentElement.classList.add('fieldset-content'); + if (infoUnobtainableElement.style.display == "none") { checkEntries(items, infoUnobtainableElement, "isUnobtainable"); } @@ -283,7 +291,7 @@ function loadCurrentVersion() { checkEntries(items, infoRemovedElement, "isRemoved"); } - loadEntries(items, itemsElement, "items"); + loadEntries(items, itemsContentElement, "items"); } var elementsWithTooltips = document.querySelectorAll('.with-tooltip'); diff --git a/scss/main.scss b/scss/main.scss index f47912a..c12dec5 100644 --- a/scss/main.scss +++ b/scss/main.scss @@ -25,15 +25,7 @@ img { } main > fieldset { - display: flex; - width: 320px; - - flex-flow: row wrap; - align-content: flex-start; - - row-gap: 3px; - column-gap: 4px; } main > fieldset:only-of-type { @@ -172,7 +164,7 @@ p { #settings { margin: 0 auto 24px auto; - max-width: 320px; + width: 320px; } #settings > button { @@ -217,6 +209,16 @@ p { gap: 16px; } +.fieldset-content { + display: flex; + + flex-flow: row wrap; + align-content: flex-start; + + row-gap: 3px; + column-gap: 4px; +} + .id { text-align: center; }