Ddraig goes Responsive: The Chill Out Zone

Home
Search

Oh no! Where's the JavaScript?
Your Web browser does not have JavaScript enabled or does not support JavaScript. Please enable JavaScript on your Web browser to properly view this Web site, or upgrade to a Web browser that does support JavaScript.

As the title says Ddraig is now (almost fully) responsive.
The theme is still under development but can be downloaded for testing purposes from the [size=16]Github repo[/size]. Feedback is welcomed.

Some of the newly features:
- the space real estate when in responsive mode is used at it's best and doesn't overflow hiding elements of the theme/site or making them unaccessible
- when viewing a forum or a thread details about them can be found at the top. Such as threads and posts counts.
- ONLINE status in forum next to the user name and in the profile page
- "Who posted", the list of users who posted in a thread and the number of posts made
- as seen on this site "Latest active threads", "Participated threads" and "Unanswered threads"
- responsive flexible menu, only the links that can't fit in the window are hidden
- some of the images were replaced with CSS icons so they scale and look nice on any device
- the Admin Panel is also very responsive and you'll be able to do pretty much anything, the design wont overflow making you unable see or access stuff
- the Theme Control Panel infusion is now independent from the theme.This means there will no longer be different infusions for each theme and you can use the same infusion to control more than one theme settings.
- hot threads, they are marked with a "HOT" orange tag

[size=20]Some screenshots[/size]

Theme was tested on a Moto G using Chrome an on desktop was tested on the latest versions of Firefox and Chrome and IE8+. I wont be supporting older versions if there is something wrong, if one can't be bothered to update it's browser neither can I be bothered to support it.
In this version the support for IE7 was completely dropped, IE8 is still supported (mostly) but don't expect the theme to become responsive when using it.

DISCLAIMER:
This version is under development and is not production ready, use at your own risk

Edited by JoiNNN on 31-08-2014 02:58, 10 y

0 replies

Very nice work JoiNNN! :G

0 replies

Nice JoiNNN

But, why you dont try to remove the avatar from topic-view? I think it will be much better to display content.
Keep up this wonderful job

0 replies

Anyone got a live demo up yet?
Would not mind looking but I can't install it a the mo.

0 replies

Wonderful.... :G

0 replies

Quote

But, why you don't try to remove the avatar from topic-view? I think it will be much better to display content.

It's simply not viable from more points of view. The solution for displaying more content would be to align the avatar, ranks, stats, username etc. horizontally above the message but is not worth the coding. Anyway at the moment just resizing the avatar makes enough of room for displaying the posts content on a 360px viewport, which is the minimum size tested and "supported" but 320px for example still looks good.

0 replies

hi joihnn super theme :G 1 problem in admin Theme Control Panel I set at 1000px center all ok in 1000px in header problem not changed in 1000px in footer I want to remain large its ok , in 1600px in a larger size problem with logo or menu far out from the center including whether any solution FOR THIS ? HEADER AND CENTER THE SAME IN 1000PX

You can see the problem in my website in full screen thanks ;)

0 replies

Not sure what you mean but you can simply add theme-width class to any element, for header add it to mainheader, just before center clearfix.

Edited by JoiNNN on 31-08-2014 14:53, 10 y

0 replies

I fixed all integration with that

Code Download source

   echo "<div class='theme-width clearfix center'>
   <div id='logo'>".showbanners()."</div>"; 


   echo "<div id='subheader'>
<div class='theme-width clearfix center'>";

and and ... :G <div class='theme-width clearfix center'>

0 replies

I've checked your site and the Ddraig derived theme and found some bugs and stuff I actually forgot to implement, so thanks for using it.
If others have live demos of the theme please let me know I'd like to see if the theme renders as expected.

0 replies

footer in center 1 and 2 control left side to Change px left right from control admin 3 footer control admin attachment to external link in footer by hand or some script or images ah yes and mor mor ;)

0 replies

A few updates were made to the theme since the 1st post. Make sure to check the repo frequently if testing the theme.

As some of might not know, to test a theme's responsiveness using Firefox > got to Menu > Developer > Responsive Design View then select any size you want to test.
www.php-fusion.co.uk/infusions/forum/attachments/resppppppp.png

www.php-fusion.co.uk/infusions/forum/attachments/resppppppp.png

JoiNNN attached the following file:

resppppppp.png [No information available / 79 Downloads]

0 replies

Falk

answered 2 Sep 2014 at 05:11 AM

Super Admin

0 replies

Quote

Quote
But, why you don't try to remove the avatar from topic-view? I think it will be much better to display content.

It's simply not viable from more points of view. The solution for displaying more content would be to align the avatar, ranks, stats, username etc. horizontally above the message but is not worth the coding. Anyway at the moment just resizing the avatar makes enough of room for displaying the posts content on a 360px viewport, which is the minimum size tested and "supported" but 320px for example still looks good.
- by JoiNNN

Hm.. ok Thanks for the info :)

0 replies

some problems not working some infusions von Craig fusion_tube http://www.hellasplus.com/infusions/f.../index.php or login pop up java the blocked them ?

the good thing is that able to convert it to what who wanted 90% :G

and surely I will do Cappie different style :D

Corrections and why was no picture in privat setting

Code Download source

//Open Sans font
if (FUSION_SELF !=="maintenance.php" && FUSION_SELF !=="go.php") {
 add_to_head("<!-- Mobile Specific Metas -->
<meta name='viewport' content='width=device-width, initial-scale=1.0' />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css' />");
}

0 replies

About Fusiontube yo mean this? [LINK]

I am sure that it fixed by now in FusionTube v1.09 at least?

0 replies

ok I have the old v1.8

I have a problem here Ddraig theme the other themes is fine

I think the problem is from Ddraig theme

you tried the?

0 replies

It was an old FusionTube style...

https://www.php-fusion.co.uk/forum/viewthread.php?thread_id=31752&pid=177374#post_177364

That is the fix.

0 replies

Craig ok thanks :G

and Craig or JoiNNN
how to integrate this title in news in readmore

Code Download source

   $breaking_news = 56600; //Breaking News Time (1 Hour/60 Mins/3600 Seconds)
if (!isset($_GET['readmore'])) {
    opentable("<span class='' onclick=\"location='".BASEDIR."news.php?readmore=".$info['news_id']."'\" style='cursor:pointer;'>".$subject."</span> ".(time()-$info['news_date'] < $breaking_news ? " <img class='breaking-news' src='".get_image("new")."' title='".$locale['theme_039c']."' alt='".$locale['theme_039c']."'/>" :
   ($info['news_sticky'] == 1 ? "<img class='sticky-news' src='".get_image("sticky")."' title='".$locale['theme_038b']."' alt='".$locale['theme_038b']."'/>" : "")));
   }else{
         opentable($subject.(time()-$info['news_date'] < $breaking_news ? " <img class='breaking-news' src='".get_image("new")."' title='New News Item' alt='New News Item'/>" :
   ($info['news_sticky'] == 1 ? "<img class='sticky-news' src='".get_image("sticky")."' title='Sticky News Item' alt='Sticky News Item'/>" : "")));
   }

in this

Code Download source

function render_news($subject, $news, $info) {
global $locale, $settings;
   opentable($subject, "post", $info, "N");
   echo "<ul class='item-info news-info'>\n";

0 replies

Remove...

Code Download source

 opentable($subject, "post", $info, "N");

Replace with your code here.

0 replies

Craig in this theme

problem in top spoiled

Code Download source

//Render News
 function render_news($subject, $news, $info) {
    global $locale, $settings, $aidlink;
   $parameter= $settings['siteurl']."news.php?readmore=".$info['news_id'];

$title= $settings['sitename'].$locale['global_200'].$locale['global_077'].$locale['global_201'].$info['news_subject']."".$locale['global_200'];
   $breaking_news = 56600; //Breaking News Time (1 Hour/60 Mins/3600 Seconds)
if (!isset($_GET['readmore'])) {
   
    opentable("<span class='' onclick=\"location='".BASEDIR."news.php?readmore=".$info['news_id']."'\" style='cursor:pointer;'>".$subject, "</span> ".(time()-$info['news_date'] < $breaking_news ? " <img class='breaking-news' src='".get_image("new")."' title='".$locale['theme_039c']."' alt='".$locale['theme_039c']."'/>" :
   ($info['news_sticky'] == 1 ? "<img class='sticky-news' src='".get_image("sticky")."' title='".$locale['theme_038b']."' alt='".$locale['theme_038b']."'/>" : "")));
   }else{
         opentable($subject.(time()-$info['news_date'] < $breaking_news ? " <img class='breaking-news' src='".get_image("new")."' title='New News Item' alt='New News Item'/>" :
   ($info['news_sticky'] == 1 ? "<img class='sticky-news' src='".get_image("sticky")."' title='Sticky News Item' alt='Sticky News Item'/>" : "")));
   }
   
   
   
   
   
                  echo "<div class='flright clearfix'>\n
              <a href='".BASEDIR."print.php?type=N&amp;item_id=".$info['news_id']."'><img  src='".get_image("printer")."' title='Print' alt='printer' /></a>\n";
            if (iADMIN && checkrights("N")) {
          echo " <a href='".ADMIN."news.php".$aidlink."&amp;action=edit&amp;news_id=".$info['news_id']."'><img  src='".get_image("edit")."' alt='".$locale['global_076']."' title='".$locale['global_076']."' border='0' /></a>\n";
               }
         echo "</div>\n";
   
   
   
   
   echo "<ul class='item-info news-info'>\n";
   //Author
   echo "<li class='author'>".profile_link($info['user_id'], $info['user_name'], $info['user_status'])."</li>\n";
   //Date
   echo "<li class='dated'>".showdate("newsdate", $info['news_date'])."</li>\n";
   //Category
   echo "<li class='cat'>\n";
      if ($info['cat_id']) {
         echo "<a href='".BASEDIR."news_cats.php?cat_id=".$info['cat_id']."'>".$info['cat_name']."</a>\n";
      } else {
         echo "<a href='".BASEDIR."news_cats.php?cat_id=0'>".$locale['global_080']."</a>";
      }
   echo "</li>\n";
   //Reads
   if ($info['news_ext'] == "y" || ($info['news_allow_comments'] && $settings['comments_enabled'] == "1")) {
   echo "<li class='reads'>\n";
      echo $info['news_reads'].$locale['global_074']; 
   echo "</li>\n";}
   //Comments
   if ($info['news_allow_comments'] && $settings['comments_enabled'] == "1") { echo "<li class='comments'><a ".(isset($_GET['readmore']) ? "class='scroll'" : "")." href='".BASEDIR."news.php?readmore=".$info['news_id']."#comments'>".$info['news_comments']."".($info['news_comments'] == 1 ? $locale['global_073b'] : $locale['global_073'])."</a></li>\n"; }
   echo "</ul>\n";
   
//The message
       echo "<div class=''>".$info['cat_image'].$news."</div>\n";


//Read more button
   if (!isset($_GET['readmore']) && $info['news_ext'] == "y") {
      echo "<div class='readmore flright'><a href='".BASEDIR."news.php?readmore=".$info['news_id']."' class='news-button'>".$locale['global_072']."..</a></div>\n";
   }
   echo "<!--news_id-".$info['news_id']."_end-->";
   closetable();
}

http://www.hellasplus.com/imagehost.p...&id=15

Edited by dimki on 13-09-2014 16:39, 10 y

0 replies

Category Forum

General Discussion

Labels

None yet

Statistics

Views 0 views
Posts 59 posts
Votes 0 votes
Topic users 11 members

11 participants

Notifications

Track thread

You are not receiving notifications from this thread.

Ddraig goes Responsive

59 posts

PHPFusion

Resources

Community

Development