nutritionix / nutrition-label

Create a FDA-style nutrition label with any nutrition data source (even the Nutritionix API - http://www.nutritionix.com/api)
http://www.nutritionix.com/
MIT License
176 stars 66 forks source link

check if there are issues on the bars on the legacy label #124

Closed majin22 closed 4 years ago

majin22 commented 4 years ago

while working on #121 and #123, I noticed that there are cases where the bars are a lot thicker and found that this is because there are cases where the bottom bar or top bar (thin line) are present when they shouldn't be

when I find the time, I need to check if this bug is also present on the legacy label

cc @mattsilv to keep him informed

majin22 commented 4 years ago

using this debug css code, it shows that this is an issue on the legacy admin

.nutritionLabel .line {
    border-top: 10px solid red;
}

.nutritionLabel .tblCalorieDiet th {
    border-bottom: 13px solid green;
}

.nutritionLabel .bar1 {
    height: 20px;
    background: #f2a50a;
}

.nutritionLabel .bar2 {
    height: 15px;
    background: #f52ff5;
}

there should be no 2 colors on top of each other as that's the reason why there are cases where the black links are thicker than normal

Legacy Version Demo Page

majin22 commented 4 years ago

the fix now solves unexpected double bars and at the same time, js and css fix are put into place so that the labels will still look the same

Legacy Version Demo Page (1)

@Yurko-Fedoriv I just want to let you know that a new version has been published. thanks