0
Welcome Guest! Login
0 items Join Now

SOLVED Relative URL in scss files problem - Folder structure removed

    • V-Web's Avatar
    • V-Web
    • Rocketeer
    • Posts: 91
    • Thanks: 0

    SOLVED Relative URL in scss files problem - Folder structure removed

    Posted 8 years 8 months ago
    • Strange problem here which seems to have started after updating to the latest Gantry5 framework. I had some background images defined in a couple of SCSS files. I found out that none of the images are showing anymore and the reason is obvious. The folder structure is removed in front of the image name.

      SCSS: background: rgba(80, 80, 80, 0.1) url("../../images/backgrounds/project-bg.jpg") repeat scroll 0 0;
      Output: background: rgba(0, 0, 0, 0) url("project-bg.jpg") repeat scroll 0 0;

      Do I need to use some sort of new syntax?
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Relative URL in scss files problem - Folder structure removed

    Posted 8 years 8 months ago
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Relative URL in scss files problem - Folder structure removed

    Posted 8 years 8 months ago
    • V-Web - we've just updated the CI build to add a fix for this issue - could you give it a try please and let us know if it fixes the issue you had please. That's the only fix in the CI build at present.

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: SOLVED Relative URL in scss files problem - Folder structure removed

    Posted 8 years 8 months ago
    • For anyone who comes across this topic. It's is bad practice to use complex relative links to navigate directory structures - Best practice is to use the URI's that Gantry 5 provides - e.g.

      Instead of writing:
      .mytest { background-image: url("../../images/backgrounds/base/img-01.jpg"); }

      Use this instead:
      .mytest { background-image: url("gantry-theme://images/backgrounds/base/img-01.jpg"); }


      Regards, Mark.
    • The following users have thanked you: V-Web

    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • V-Web's Avatar
    • V-Web
    • Rocketeer
    • Posts: 91
    • Thanks: 0

    Re: SOLVED Relative URL in scss files problem - Folder structure removed

    Posted 8 years 8 months ago
    • I completely agree and for Gantry5 themes definitely the way to go. I have changed the use of relative urls to the gantry standard.

      Thanks for the quick response though, very much appreciated!
    • Last Edit: 8 years 8 months ago by V-Web.

Time to create page: 0.116 seconds