If you have any questions, comments or issues with this project please post them here!
Hi!
While I have completed the challenge for Day78, for some reason the âstyle.cssâ file is not being read/loaded (I donât know the correct term) when I run the âmain.pyâ file. Can someone please help me out with this?
Here is the link to my Day78 Repl: https://replit.com/@Milindh/Day78100Days#main.py
from flask import Flask
contents = {}
for i in range(24):
if ((i+77)%2==0):
n = int(i+77)
contents[n] = {"text": "Hmm. Looks super confusing. Not sure how this will work!"}
else:
n = int(i+77)
contents[n] = {"text": "Hmm think I have got a hang of this. It is working now!"}
app = Flask(__name__)
@app.route('/')
def blankHome():
page = ""
return page
@app.route('/<pageNumber>')
def index(pageNumber):
if (pageNumber == 'favicon.ico' or pageNumber == 'script.js' or pageNumber == 'style.css'): return ""
tabTitle = f"Day {pageNumber} Reflection"
heading1 = f"Reflection for Day {pageNumber}"
heading2 = f"here is the code for Day {pageNumber}"
n = int(pageNumber)
text = contents[n]["text"]
dayLink = f"https://replit.com/@SixftOne-MLH/Day{pageNumber}100Days#main.py"
page = ""
f = open("website.html", "r")
page = f.read()
f.close()
page = page.replace("{tab title}", tabTitle)
page = page.replace("{heading1}", heading1)
page = page.replace("{heading2}", heading2)
page = page.replace("{dayLink}", dayLink)
page = page.replace("{text}", text)
return page
app.run(host='0.0.0.0', port=81)
I used the above code. But it didnât work. The âstyle.cssâ file is not being read.
For more context: Note that the homepage is supposed to be blank. But if you will add any number at the end of homepage URL (for eg see this link: Day 78 Reflection) then a webpage will load up based on the number that you add. So based on the HTML code that I have written, the webpage that loads should read the âstyle.cssâ file, but it doesnât.
I did, it works when I tested it
For some reason its not working for me.
If I run the code and access this url : Day 78 Reflection - the background color of the website should be black and the font color should be white. But I get the default white background and black font color. Have attached a screenshot also.
because there are semicolons missing:
Nope the css file is still not being read. Did it work for you?
I still get the default style, see screenshot below:
Okay I found the solution.
Originally âstyle.cssâ file was in the same/main directory right along with the âhtmlâ file and hence the âcss hrefâ in the html code was simply âstyle.cssâ
But if I create a âstaticâ folder and put the âstyle.cssâ file in that folder, and then update the âcss hrefâ in the html code to âstatic/style.cssâ, then it works!
I donât know the logic behind it, but the css file is being implemented now.
thatâs an interesting find! i reproduced this behavior by moving my css file out of the static folder. you can see what happens when you view the site source code and try to follow the link to the css file: you canât access it because anything after the URL will be treated as the variable, file names included, unless there is another forwardslash. even then, apparently the static folder has to be named âstaticâ or itâs inaccessible.