john-smilga / js-budget-setup Goto Github PK

The issues is that more then one expense in the list will break the edit and delete icon functionality. As a result it is not possible to make edits or delete items in the list except for the last item in the list. I think it is a CSS problem but not quite sure. My lack of understanding with what is going on with the Bootstrap & flex stuff I am struggling to fix this. It was reported in YouTube comments that this will fix the problem:
delete line 113 in main.css : font-size: 2.6 rem
This is not a solution it is more of a hack in my view, as it actually causes inconsistent fonts sizing between other elements in the UI.

I am wondering if anyone has fixed this issue and I curious how they did fix it. If there are no fixes as of yet, can you as the project owner or any community member help us resolve this issue?

Great teaching and thank you for your time.

After adding this code I have this error. Also typescript last version is installed.

Hello, Master, I am trying to follow the FREECODECAMP lesson but I am stuck in this part:
the console gives me an error on the div.innerHTML = ' it gives me a syntax error saying the single quote used is incorrect and found no reference online, could you help?

everything works perfectly.

//add expense

addExpense(expense) {
    const div = document.createElement('div');
    div.classList.add('expense');

   /* //############after building this part app stop working#############
    div.innerHTML = '
	<div class="expense">
	<div class = "expense-item d-flex justify-content-between align-items-baseline" >

    <h6 class = "expense-title mb-0 text-uppercase list-item" > -${expense.title} < /h6> 
	<h5 class = "expense-amount mb-0 list-item" > -${expense.amount} < /h5>

    <div class = "expense-icons list-item" >

    <a href = "#" class = "edit-icon mx-2" data-id = "${expense.id}" >
    <i class = "fas fa-edit" > < /i> 
	</a> <a href = "#" class = "delete-icon" data-id = "${expense.id}" >
    <i class = "fas fa-trash" > < /i> 
	</a> 
	</div>
	</div>
	</div>
	
	';
    

    this.expenseList.appendChild(div);
	//##########after building this part app stop working##############// */

}

downloaded the whole src

when i enter numbers or values to the page, it doesn't print any numbers or add expense to the list