サイト公開 CSSが反映されていない? GitHub

Question

前提・実現したいこと

GitHubで試作のホームページを公開したのですが、見た目が上手く反映されていません。ちなみにFirebaseでもサイトの公開をしてみましたが、反映される見た目は同じでした。。ファイルの構成が問題なのかもしれないと思ったのですが、どのように変更すればいいのか分かりません。Html上での記述にも問題があるかもしれませんが、分からない状況です。
サイトの見た目を、自分がオフラインで開発していた見た目と同じにしたいです。

もし解決策が分かる方いらっしゃれば宜しくお願い致します。

発生している問題・エラーメッセージ

開発環境上とサイトを公開した時の見た目が違う。

該当のソースコード

GitHubを使って公開したサイトのUrlです。
https://naffchen.github.io/myportfoliosite/

試したこと

完成したサイトが崩れるのが怖くて特に試したことはありません。

補足情報（FW/ツールのバージョンなど）

ファイルの構成は、
St.Louise > CSS >_loading.scss, _responsive.scss, _variables.scss, styles.css, styles.css.map, styles.scss
> img > 各imageファイル
> js > main.js
> myportfolioproject > 空
> Naffchen.github.io > CSS, img, js, index.html, README.md
> index.html

Comments

[m.ts10806]

>完成したサイトが崩れるのが怖く

Gitですぐに指定のリビジョンに戻せば良いのでは？

[Naffchen]

GitHubというものを初めて使ったので、お手本にしていたサイトに載っている以外のことをするのが怖かったんですよね。。正直リビジョンなどの意味も分からないので勉強します。
リアクション有難うございました。

Answer 1

style.cssの、ファイルパスはSt.Louise/CSS/style.cssですね。

一方、index.htmlのlink要素は

<link rel="stylesheet" href="css/styles.css">

となっていますので、ロードに失敗してますね。

リポジトリをcloneさせていただいて、試してみましたが、
私のローカル環境でもロードに失敗してました。

画像の一部も読めてないようですので、ファイルの置き場やファイル名を再確認してみてください。

Comments

[Naffchen]

回答頂き有難うございました！お陰様で無事に見た目の崩れていないサイトを公開することができました！
ファイルパスを読み込めていない、というヒントのおかげです。
まずこれ<link rel="stylesheet" href="css/styles.css">　に合わせてファイル名を変更しました。GitHubにファイルをアップロードする際にSt.Louiseの親フォルダごとしていたのですが、各ファイルや各フォルダごとつまんで放り込んでみました。
イメージが読み込まれていなかったのは、loading用のイメージで、単純にhtmlのimg内記述に、.pngを書き忘れていました。。
無事にサイト公開出来てホッとしています。有難うございました！

質問内に乗せた自分の失敗URLは既に削除させていただきました。