Styles.sass not compiling in jekyll on gh-pages

[elieven]

May god help me fix this i am 5 minutes away from a mental breakdown. Long story short i’ve tried just about everything to get the styles.sass to import the rest of partials and compile into a normal styles.css but it doesn’t. What’s more it generates a styles.css file but inside is some totaly random code. The site is https://elieven.github.io/. Take a look in the sources - i have no clue where it’s getting that code from.

[mmistakes]

Couple of things.

1. Get rid of baseurl: /, that’s not doing you any favors.
2. Get rid of /css/styles.css, this is probably overwriting the .sass one you’re trying to compile.
3. Fix your paths to your CSS/JS files in your layouts. They’re all wrong and coming up missing. Try using Jekyll’s relative_url filter instead like this:

<!-- Fonts -->
    <!-- Roboto -->
    <link href="https://fonts.googleapis.com/css?family=Roboto:400,500&amp;subset=latin-ext" rel="stylesheet">
    <!-- Logo font -->
    <link href="{{ 'assets/font/poppins.css' | relative_url }}" rel="stylesheet" type="text/css">

    <!-- Page style -->
    <!-- tailwind for in dev -->
    <link href="https://cdn.jsdelivr.net/npm/tailwindcss/dist/tailwind.min.css" rel="stylesheet">
    <!-- bootstrap grid - probably to be replaced with tailwind grid -->
    <link href="{{ 'assets/css/grid.css' | relative_url }}" rel="stylesheet" type="text/css">
    <!-- normal page style (but currently all in one file) -->
    <link href="{{ 'assets/css/style.css' | relative_url }}" rel="stylesheet" type="text/css">
    <!-- syntax highlighting styles -->
    <link href="{{ 'assets/css/syntax.css' | relative_url }}" rel="stylesheet" type="text/css">
    <!-- test file -->
    <link href="{{ '/assets/css/main.css' | relative_url }}" rel="stylesheet" type="text/css">

Then it should start loading your CSS properly: