CSS/SCSS changes to code not applying in browser - html

Question

I am trying to hide a number by modifying the scss/css. It is the tag in the picture: poll-row__number.
Strange thing is also it is not in the scss file the inspector is showing but another.
I am running an Adhocracy installation (Nginx on Ubuntu Linux) in a virtual environment. I changed all the poll-row__number references in css/ scss files to display:none / visibility:hidden. Rebooted the server and deleted my cache from my browser, tried Chrome, FireFox and Safari. But the number stays visible. When I change it in the inspector, it dissapears.
This is my css directory with files
The poll-row__number is in _poll.scss like here
As you can see the value display:none/ visibility:hidden is added.
When grepping the div it finds nothing systemwide. When grepping the pol-row__number it finds it, but everything it finds is changed to display:none/ visibility:hidden.
What am I doing wrong and what else do you want for information to help me fix this strange ptoblem.
I tried all I can think of.

Answer 1

There's not much of code you're showing us. So it'll be hard to find the error.
Try to add display: none; in the console (web browser)
First make sure the scss is translated to the css file :
sass --watch src/scss/_project_header.scss:src/css/_project_header.css
Second, verify that the .poll-row__number is not used in another css file linked to you html file because as we can see the current display is inline-block.
Then, check if you don't use twice .poll-row__number because the basic css rule is the following, the last property stated is the one that overlaps the others, example :
CSS
.poll-row__number{
display :none;
}
.poll-row__number{
display :inline-block;
}
There, .poll-row__number will get inline-block. And I just saw that you have this issue in your code (or was it on purpose) :
Line 1 : .poll-row__number (has no display property)
Line 2 : .poll-row__number, .poll-row__label (has display inline-block)
(It is my opinion but using "__" for ids or class is ugly and confusing. Please stop it: either use "CamelCase" or just use one "_")

Answer 2

Thanks for all the help. I found the solution. Maybe obvious for a lot of developers, but I am not a pro in this sence.
What I did:
I changed the css/scss files that I wanted to change.
Then I went to my virtual environment and did:
npm install npm run build:prod
pip install --upgrade -r requirements.txt
export DJANGO_SETTINGS_MODULE=adhocracy-plus.config.settings.build
python manage.py compilemessages
python manage.py collectstatic
I do not know if they all are needed, but I figured, maybe the css/scss is build and stored somewhere and then called so it overrides the css file in the projectfolder.
After this I restarted my processes:
sudo systemctl
restart Adhocracy-plus
sudo systemctl restart Adhocracy-plus.service
sudo systemctl restart Adhocracy-plus-background-task
sudo systemctl restart nginx
Then it worked.
In conclusion:
CSS/SCSS is compiled. So changed the CSS/SCSS, recompiled/ build the project ,restarted the services.