Page Index Toggle Pages: [1] 2 3  Send TopicPrint
Very Hot Topic (More than 25 Replies) Now on HTML5 (Read 25071 times)
Dandello
Forum Administrator
*****
Offline


I love YaBB 2.7!

Posts: 1759
Location: The Land of YaBB
Joined: Feb 12th, 2014
Gender: Female
Re: Now on HTML5
Reply #38 - Oct 31st, 2014 at 4:55am
Print Post  
The XHTML default template is back and the HTML5 is now an optional template. I still have some tweaking to do.

The UBBC folders have been moved out of Templates/Forum/ and into yabbfiles/UBBCbuttons so there only needs to be one copy of the UBBC buttons.
I think the 'new message' button can be styled using just css.
  

Perfection is not possible. Excellence, however, is excellent.
Back to top
WWW  
IP Logged
 
Monni
Senior Member
****
Offline


Min izāmō

Posts: 413
Location: Kaarina, Finland
Joined: Jul 16th, 2014
Gender: Male
Re: Now on HTML5
Reply #37 - Oct 28th, 2014 at 10:26pm
Print Post  
Dandello wrote on Oct 28th, 2014 at 8:32pm:
I found the tag mismatch - I had moved the table-display styling into a class in the css file - but for the Calendar roll-up it needed to remain as a style rather than a class.  Huh


We always learn something new by making mistakes...
  
Back to top
IP Logged
 
Dandello
Forum Administrator
*****
Offline


I love YaBB 2.7!

Posts: 1759
Location: The Land of YaBB
Joined: Feb 12th, 2014
Gender: Female
Re: Now on HTML5
Reply #36 - Oct 28th, 2014 at 8:32pm
Print Post  
I found the tag mismatch - I had moved the table-display styling into a class in the css file - but for the Calendar roll-up it needed to remain as a style rather than a class.  Huh
  

Perfection is not possible. Excellence, however, is excellent.
Back to top
WWW  
IP Logged
 
Monni
Senior Member
****
Offline


Min izāmō

Posts: 413
Location: Kaarina, Finland
Joined: Jul 16th, 2014
Gender: Male
Re: Now on HTML5
Reply #35 - Oct 28th, 2014 at 3:38pm
Print Post  
Dandello wrote on Oct 28th, 2014 at 2:03pm:
The Calendar XHTML rollup doesn't work in in HTML5 - probably a tag mismatch. However the Marquee rollup does work.  Go figure, the better one is the one that's deprecated.


It obviously needs complete redesign as it is using single column table and we already decided that was bad design idea...
  
Back to top
IP Logged
 
Dandello
Forum Administrator
*****
Offline


I love YaBB 2.7!

Posts: 1759
Location: The Land of YaBB
Joined: Feb 12th, 2014
Gender: Female
Re: Now on HTML5
Reply #34 - Oct 28th, 2014 at 2:03pm
Print Post  
The Calendar XHTML rollup doesn't work in in HTML5 - probably a tag mismatch. However the Marquee rollup does work.  Go figure, the better one is the one that's deprecated.
  

Perfection is not possible. Excellence, however, is excellent.
Back to top
WWW  
IP Logged
 
Monni
Senior Member
****
Offline


Min izāmō

Posts: 413
Location: Kaarina, Finland
Joined: Jul 16th, 2014
Gender: Male
Re: Now on HTML5
Reply #33 - Oct 23rd, 2014 at 9:57pm
Print Post  
I was playing with the top stuff using spans...

Code
Select All
<div class="menutop">
            <span class="small" style="display: inline-block; padding-left:1%; width: 20%; line-height:2.6em; vertical-align: top;" id="yabbclock">23. lokakuuta 2014 klo 00:52<script type="text/javascript">
WriteClock('yabbclock','23. lokakuuta 2014 klo ',' ');
</script></span>
            <span class="small center" style="display: inline-block; width: 57%; line-height:2.6em; vertical-align: top;">Change Template:&nbsp;
            <form name="styleswitcher" action="http://yabbforumsoftware.com/cgi-bin/yabb2/YaBB.pl" method="post">
            <input type="hidden" name="redir" value="">
            <select name="template" onchange="submit()">
        <option value="Forum default" selected="selected">Forum default</option>
<option value="New Fall">New Fall</option>

            </select>
             <input type="hidden" name="formsession" value="477F5C5C3E5A7B687B72716E737B706A3E387F736E253E53717A6D5377757F521E0">
                    </form>
        </span>
  <span style="display: inline-block; width: 20%; padding-right: 1%">
<span class="yabb_searchbox">
                    <form action="http://yabbforumsoftware.com/cgi-bin/yabb2/YaBB.pl?action=search2" method="post" accept-charset="UTF-8">
                        <input type="hidden" name="searchtype" value="allwords">
                        <input type="hidden" name="userkind" value="any">
                        <input type="hidden" name="subfield" value="on">
                        <input type="hidden" name="msgfield" value="on">
                        <input type="hidden" name="age" value="31">
                        <input type="hidden" name="oneperthread" value="1">
                        <input type="hidden" name="searchboards" value="!all">
                        <input type="text" name="search" size="16" id="search1" value="Haku" style="font-size: 11px;" onfocus="txtInFields(this, 'Haku');" onblur="txtInFields(this, 'Haku')">
                        <input type="image" src="http://yabbforumsoftware.com/yabbfiles/Templates/Forum/default/search.png" alt="Viestit ei vanhempia kuin  31 päivää" title="Viestit ei vanhempia kuin 31 päivää" style="background-color: transparent; margin-right: 5px; vertical-align: middle;">
                     <input type="hidden" name="formsession" value="477F5C5C3E5A7B687B72716E737B706A3E387F736E253E53717A6D5377757F521E0">
                    </form></span><span class="yabb_rss"><a href="http://yabbforumsoftware.com/cgi-bin/yabb2/YaBB.pl?action=RSSrecent" target="_blank"><img src="http://yabbforumsoftware.com/yabbfiles/Templates/Forum/default/rss.png" alt="RSS-syöte" title="RSS-syöte"></a></span>


  </span>
            <div class="clear"></div>
        </div>
 



This is uncleaned raw html straight from debugger session Smiley

20%+57%+20% = 97%, which was few pixels too small.
  
Back to top
IP Logged
 
Monni
Senior Member
****
Offline


Min izāmō

Posts: 413
Location: Kaarina, Finland
Joined: Jul 16th, 2014
Gender: Male
Re: Now on HTML5
Reply #32 - Oct 23rd, 2014 at 6:59pm
Print Post  
Dandello wrote on Oct 23rd, 2014 at 5:28pm:
Good advice.  Smiley


Eh... I used to be member of the IE beta team Wink IE is the main browser using Trident engine Smiley
  
Back to top
IP Logged
 
Dandello
Forum Administrator
*****
Offline


I love YaBB 2.7!

Posts: 1759
Location: The Land of YaBB
Joined: Feb 12th, 2014
Gender: Female
Re: Now on HTML5
Reply #31 - Oct 23rd, 2014 at 5:28pm
Print Post  
I think the html5 version may be offered as an add-on template rather than main-line code for some time. However, working on it has pointed out some interesting issues in terms of things being hard-coded in Mods.

There are a lot of unexpected things that have shown up in this particular exercise.
It's also been pointed out that I may have been moving too fast on this. So expect some changes as I rearrange things like templates and do some work in the AdminCenter.

Monni wrote on Oct 23rd, 2014 at 4:45pm:
Sometimes using spans instead of divs makes things look better, especially if everything is supposed to be fit and align on same physical horizontal row. 
                   

Good advice.  Smiley
  

Perfection is not possible. Excellence, however, is excellent.
Back to top
WWW  
IP Logged
 
Monni
Senior Member
****
Offline


Min izāmō

Posts: 413
Location: Kaarina, Finland
Joined: Jul 16th, 2014
Gender: Male
Re: Now on HTML5
Reply #30 - Oct 23rd, 2014 at 4:45pm
Print Post  
Looks like a few of the "divs" are too wide... SlimBrowser uses Trident engine, which uses implicit padding of elements, and that creates weird effects when you assume the whole width of screen or outer element is 100%, when it actually is slightly less, somewhere around 99.4% depending on number of elements in a horizontal row and width of the window.

Sometimes using spans instead of divs makes things look better, especially if everything is supposed to be fit and align on same physical horizontal row.
  
Back to top
IP Logged
 
Dandello
Forum Administrator
*****
Offline


I love YaBB 2.7!

Posts: 1759
Location: The Land of YaBB
Joined: Feb 12th, 2014
Gender: Female
Re: Now on HTML5
Reply #29 - Oct 23rd, 2014 at 2:29pm
Print Post  
Moving to divs creates some interesting vertical alignment issues. 
I'm still tweaking this one.
  

Perfection is not possible. Excellence, however, is excellent.
Back to top
WWW  
IP Logged
 
XTC
Global Moderator
*****
Offline


YaBB 2.6.0/1/11 Mods

Posts: 159
Location: @ustria
Joined: Feb 12th, 2014
Gender: Male
Re: Now on HTML5
Reply #28 - Oct 23rd, 2014 at 9:58am
Print Post  
Hello

I know  .... SlimBrowser is  Smiley

But new Template looks funywith SlimBrowser  Sad Shocked
With Chrome looks ok  Wink

lg XTC
  

dan_board.jpg (Attachment deleted | 70 Downloads )

Back to top
 
IP Logged
 
Dandello
Forum Administrator
*****
Offline


I love YaBB 2.7!

Posts: 1759
Location: The Land of YaBB
Joined: Feb 12th, 2014
Gender: Female
Re: Now on HTML5
Reply #27 - Oct 22nd, 2014 at 5:13pm
Print Post  
I just lost my testbed server so I can't do anything until that's squared away. 
Edited:
Testbed server is back - it was a router/Skype problem.
« Last Edit: Oct 22nd, 2014 at 8:50pm by Dandello »  

Perfection is not possible. Excellence, however, is excellent.
Back to top
WWW  
IP Logged
 
Monni
Senior Member
****
Offline


Min izāmō

Posts: 413
Location: Kaarina, Finland
Joined: Jul 16th, 2014
Gender: Male
Re: Now on HTML5
Reply #26 - Oct 22nd, 2014 at 3:30pm
Print Post  
Dandello wrote on Oct 21st, 2014 at 8:25pm:
In order to keep from completely frustrating the templaters we may just go from 2.6.1 to 2.8.0.


Or 2.7.0 ... I went through the patches today... Some changes looked weird (for example Polls) and some just simply incomplete (for example Registration)... I can't make a clean diff until the code is on subversion, the diff would in current state be too big.
  
Back to top
IP Logged
 
Monni
Senior Member
****
Offline


Min izāmō

Posts: 413
Location: Kaarina, Finland
Joined: Jul 16th, 2014
Gender: Male
Re: Now on HTML5
Reply #25 - Oct 21st, 2014 at 9:37pm
Print Post  
Ok... I will import the changes to my local checkout tree after I come back from work and look at it more.... It's getting really late here...
  
Back to top
IP Logged
 
Dandello
Forum Administrator
*****
Offline


I love YaBB 2.7!

Posts: 1759
Location: The Land of YaBB
Joined: Feb 12th, 2014
Gender: Female
Re: Now on HTML5
Reply #24 - Oct 21st, 2014 at 9:15pm
Print Post  
This one needs more work to get the font sizes and other heights to be more responsive.

Code
Select All
Index: default.css
===================================================================
--- default.css	(revision 1763)
+++ default.css	(working copy)
@@ -141,6 +141,10 @@
     border-spacing: 1px;
 }

+table.fixed {
+    table-layout:fixed;
+}
+
 #maincontainer {
     border-top: 0;
     margin-bottom: 10px;
@@ -234,7 +238,7 @@
 }

 .menutop {
-    height: 25px;
+    height: 2.25em;
     background-color: #6499d0 ;
     font-weight: bold;
     text-align: left;
@@ -242,7 +246,7 @@
 }

 .mainbottom {
-    height: 25px;
+    height: 2.25em;
     width: 100%;
     background-color: #2d2d2d;
     font-weight: bold;
@@ -783,7 +787,7 @@

 .displaycontainer {
     background-color: #fff;
-    padding: 1px;
+    padding: 1px 0;
     width: 100%;
 }

@@ -1291,7 +1295,6 @@
     display: inline-block;
 }

-
 span.ubbcbutton {
     height: 22px;
     width: 23px;
@@ -1305,6 +1308,7 @@
     display: inline-block;
 	float:left;
 }
+
 .ubbcbuttonback {
 	background-image: url(./default/UBBC/ubbc2.png);
 }
@@ -1971,10 +1975,13 @@
     margin: 0 auto;
 }

+.system-body {
+    margin: 0 auto;
+    width: 80%;
+}
+
 .system-info {
-    margin: 0 auto;
     height: 35px;
-    width: 80%;
     font-size: 12px;
     font-family: Verdana, Arial, Sans-Serif;
     color: #eee;
@@ -1983,9 +1990,6 @@
     -moz-border-radius: 5px 5px 0 0;
     border-radius: 5px 5px 0 0;
     border-bottom: 1px solid #195392;
-}
-
-.system-info td {
     text-align: center;
     font-weight: bold;
     vertical-align: middle;
@@ -1992,22 +1996,10 @@
 }

 .system-info-body {
-    width: 80%;
     background-color: #dee4ec;
-    padding: 1px;
-    border-collapse: separate;
-    border-spacing: 1px;
+    padding: 8px;
 }

-.system-info-body td {
-    background-color: #eee;
-    font-size: 12px;
-    font-weight: 400;
-    font-style: normal;
-    color: #2d2d2d;
-    padding: 1em;
-}
-
 .smiley_box {
     height: 65px;
     width: 120px;
@@ -2041,18 +2033,30 @@

 .off-color { color:#ccc;}

-span.mood {
-border: 1px #000 solid;
-border-radius: 5px;
-height:12px;
-padding: 0 3px 0 2px;
-vertical-align:top;
-color:#000;
-font-size:10px;
+span.NewLinks {
+background-image: url(./default/new-l.png);
+height:11px;
+display: inline-block;
+vertical-align:middle;;
+padding: 0 0 0 2px;
+background-position: left bottom;
+background-repeat: no-repeat;
 }
-
-span.mood img {
-margin-left:-1px;
-margin-top:-2px;
+span.NewLinks_r {
+background-image: url(./default/new-r.png);
+height:11px;
+display: inline-block;
+vertical-align:baseline;
+padding: 0 2px 0 0;
+background-position: right top;
+background-repeat: no-repeat;
+}
+span.NewLinks_c {
+background-image: url(./default/new-c.png);
+color:#fff;
+font-size:8px;
+height:11px;
+display: inline-block;
 vertical-align:top;
+padding: 0 2px;
 }
\ No newline at end of file
 

  

Perfection is not possible. Excellence, however, is excellent.
Back to top
WWW  
IP Logged
 
Page Index Toggle Pages: [1] 2 3 
Send TopicPrint