Login



Lost Password? Create An Account
Demos

Forum Support

 
Advanced Search


[1]

Offline Gutshot
Joomla Developer Member
Posts: 487
Posted on: December 13, 2017, 07:44:14 AM

Hi, just read this article:

https://magazine.joomla.org/item/3284-webdesign-trends-of-2018

Some nice trends, what I like very much is the use of  isometric dimensional grid layouts. Wonderfull!!

Hope to see some of this stuff into the S5 2018 templates.

What I have thought of: (if this is possible off course  Smiley )

Some pre-made custom css that you can use in your site. let me know if the following make sense:

Let's say you want a row split in 2 (50%-50%) with 2 different backgrounds. The template "Store Pro" was already a hell of a template with the freedom of use of the backgrounds.

Or add an service/section like this on the S5 website:
https://codepen.io/jayjoomler/pen/gXdrmb

Add it as service or extra addon. (paid or free, I don't mind)

This takes editing templates to the next level. Lots of freedom then.
Users can bring the css in the "custom css" and take it from there. When this integrates in the S5 templates this can create so much freedom. No need for extensions anymore.. only clean S5 source code.. how cool would this be?

Logged

Offline jonahh
Moderator
Posts: 23775 WWW
Posted on: December 13, 2017, 02:36:59 PM

Hey,

Thanks for the input!

So you are suggesting basically adding in things like the Store Pro module backgrounds to the custom CSS file?
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug

Offline Gutshot
Joomla Developer Member
Posts: 487
Posted on: December 13, 2017, 03:50:22 PM

Hey,

Thanks for the input!

So you are suggesting basically adding in things like the Store Pro module backgrounds to the custom CSS file?

Hey,


Not necessarily, the option to choose which custom css would be a great addition, especially with the arrival of the latest css applications this would be very welcome. The option for creating your own module background  in pro store was indeed one I really liked.

Normally only on the homepage is some new custom code. Some are really cool but only to use in that template. One simpel example is to split content in one row/module/article. That way you don't need 2 modules to split the content. Below something I mean:

Quote
<div class="top_text">

<div class="top_text_left">

<div class="top_text_right">

Tons of cool custom css to add. This will save S5 developer members tons of time and can give a nice inspiration boost.

Place this kind of items in the S5 (paid) member section.

"S5 Custom css kit" Grin

The variation to be applied can be enormous.

Just my 2 cent thoughts. Smiley

Here more cool trends:
https://webflow.com/blog/19-web-design-trends-for-2018?utm_campaign=december2017No2&utm_source=newsletter&utm_medium=email&utm_source=Master&utm_campaign=0bbf1e2c93-December2017No2&utm_medium=email&utm_term=0_e8e875e4ea-0bbf1e2c93-90036501


Kind regards,




« Last Edit: December 13, 2017, 03:59:02 PM by Gutshot »
Logged

Offline jonahh
Moderator
Posts: 23775 WWW
Posted on: December 14, 2017, 12:55:15 PM

Thanks. Ok so this would be more along the lines of our "pages" drop down. That CSS works on all templates and is custom code you can place anywhere.
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug

Offline sonu11
Free Member
Posts: 1
Posted on: May 28, 2018, 01:00:15 PM

I have used this code for responsive, but it is not working ..
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}
Step 3) Add JavaScript:
Example
/* Toggle between adding and removing the "responsive" class to topnav when the user clicks on the icon */
function myFunction() {
    var x = document.getElementById("myTopnav");
    if (x.className === "topnav") {
        x.className += " responsive";
    } else {
        x.className = "topnav";
    }
}
group d rrb alp
Logged

Offline mikek
Moderator
Posts: 28716 WWW
Posted on: May 29, 2018, 07:27:07 AM

Hello,

I don't know what you are trying to apply this css too, but those classes don't apply to our templates. We don't provide support for custom css programming.
Logged

Mike Knott
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
[1]

Jump to:  


Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Page created in 0.034 seconds with 21 queries.
Looking for the largest variety in template designs? Look no more. Never buy 1 theme again. Signups start at just $49 for access to all of our themes.
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.