New SOURCE Project - The Forkin Fox returns

Project26 is now available.


View demo at https://www.webdeersign.com/pr26demo1

This is a Forkin Sourcey Version of the original and popular Forkin Fox P8 for Foundry & Foundation.

It has been brought bang up to date with some significant new layouts.

This project is a layouts project focusing on product or service of up to 6 and for those greater than 6 where the user needs to see the content and the available options. Perfect for copying and pasting the layouts you want.

Checkout the Layout 2 page for an example using a traditional non responsive sidebar in a fully adjustable responsive sidebar. The side bar includes a mix of content links and same page and remote links all styled to match.

This project uses many “projected” modals that appear inside the page instead of being overlayed on top of a page obscuring the page below. The advantage being that you can retain the navigation for the modal. The process uses Tav’s Limelight to “Project” content into Source containers.

In addition are some examples of the Source Reveal functions that permit effects like the home page “We Create We Teach We Deliver” layout.

Project26 page at PROJECT26

10 Likes

@Webdeersign – Hi, Gary,

As always, I love your project.

I am not clear on one point. For owners of your previous version of the Forkin Fox project – is this new version free, discounted or full price?

I should have made this clear actually. The original Project8 for Foundry used a great deal of non Foundry stacks to build and the same for the Foundation version.

PR26 is a total rebuild using just Source and Limelight, sharing only the graphics and general design of PR8 and so is a distinct and separate project.

3 Likes

Thanks for the clarification. I would pay a full price anyway – just because I like your design style and technical innovation. Plus, I can imagine how much effort you’ve put into this version.

5 Likes

Thanks. The Layout 2 page sidebar navigation has been developing over months and has been used on a couple of live sites. I’m very pleased with the way it works on all devices and is easy to adjust the breakpoint and sidebar width.

Heres a few more screenshots:

4 Likes

Another cracking project @Webdeersign! Lots of really interesting stuff going on in there!

3 Likes

Thanks.

I have a whole load of other Source reveal effects that I may add to this or new Projects.

2 Likes

Natura and Forkin Fox are full of elements which are changing up the way I use Source. Just Brilliant! Many thanks to you both (and Tav too, for the hidden as well as the more obvious amazingosity of Limelight).

2 Likes

I’ve just updated the project.

I have added some additional notes and I have taken advantage of the latest Source updates that make the Project notes considerably easier to see and generally less cluttered. This is the best system I have found for adding clear notes inside a project and they now stand out from the layouts.

I have also added some GPS location and social media SEO content that users can adapt and embed.

2 Likes

Ok that sounds good, I will try it. Looking forward to play with it. Thank you.

1 Like

How can I get the updated project?

You can download the latest version by logging into your Paddle account at https://my.paddle.com.

The version available for download will be the latest version.

2 Likes

I have added an additional page called Layout 3 to the project - Webdeersign RapidProject 26 for SOURCE .

This new page is identical to the overall layout of the Layout 2 page except it uses text (headers in this demo) links instead of LL Bar & buttons. The reason for this is that it uses less space and can be useful when trying to squeeze in more links to more content.

Also, it has some new cool link underline animation on the Sidebar links and also directional underline animation on the Next Previous links. Somewhat similar to how some car indicators behave, i.e. the direction of the animation goes left forPrevious or right for Next.

The animation uses the Source settings primary, secondary and button hover colours and can be configured to pick up any other Source colours.

If you have PR26, you can download the latest version by logging into your Paddle account at https://my.paddle.com 3.

5 Likes

Hello When I see the things you are doing with Source, I get more and more exited about Source actually.

3 Likes

Looks great, Gary! The icing on the cake would be highlighting of the current (active) one of these menu items. Possible…? ;-)

1 Like

That’s a challenge in the text links used in Layout 3 but LL Bar handles that in Layout 2.

You have both choices but there is of couse plenty of opportunity to highlight and illustrate the link you select from inside the content area that will display. This is really somethhing that should always be done and I would say it is not good practice to rely on an active link state to show what’s been selected and what the content is about. The content areas need to be designed to make their contents clear and obvious.

Also, when you use normal modals to overlay a web page, whatever you clicked on is usually covered and hidden by the overlayed modal.

2 Likes

Limelight adds a class of lightbox-open to any link that is used to open it so you can roll your own active item colour easily.

You could give the container for the links a custom class name but this will work fine (this uses the secondary color but you can replace the var() part with a hex or rgb colour as normal

.s-cols-container a.lightbox-open{
    color:var(--second-color)!important;
}

8 Likes

I didn’t know that. Is there anything that LimeLight doesn’t do?

I have added that to the demo and will roll it into the next update.

Thanks

1 Like

I’m sure there is plenty but I do try to think of most of the obvious stuff.

1 Like