News:

SMF 2.1.4 has been released! Take it for a spin! Read more.

Main Menu

Responsive Curve

Started by SMF Customization Team, April 20, 2015, 06:33:49 AM

Previous topic - Next topic

mossite

i will need someone to do this for me
Greatness is Goodness

Dan_

Thanks for the 2.0.10 update, and all your help.

Can the icons be changed?  I ask because when I re-size down there is no text beside the icons to explain what they are for. 

The menu items just go straight from text to Icons.   I have several and many just display a question mark Icon.

I am not sure if this is the intended behavior.  I understand 2.1 has text beside the icons when you restore the browser window down.

A link to my heavily modded forum if you would like to see the icons: http://www.eaglersnest.com/forum/index.php?action=forum

Thanks again for all you do.

Dan_

Quote from: mossite on May 27, 2015, 04:18:14 PM
i tried to install this theme and got this in the picture. who can help please

I got the same picture.  I hit install anyway.  The site was ok at full screen but was not good small.  The fixes for me were to take the 90% size out  of the forum width setting and leave that setting blank, then replace my google ads with their new responsive ones...

The forum width setting is found by clicking: Admin-Themes and layout-Theme Settings-SMF Default Theme - Curve (2.0).  The last click is in one the actual headings on that page.

Hope this helps.

Kindred

Quote from: Dan_ on June 01, 2015, 12:52:27 PM
Thanks for the 2.0.10 update, and all your help.

Can the icons be changed?  I ask because when I re-size down there is no text beside the icons to explain what they are for. 

The menu items just go straight from text to Icons.   I have several and many just display a question mark Icon.

that is correct (and, quite honestly, I think the 2.1 method is incorrect)

As for the icons -- yup - you can change them - look at your site in firefox+firebug (reduce the window size to trigger the icons) and see the CSS entry for each.
You probably have the (?) icon because you have mods that add to your main menu and have not defined icons for those mods... (see the css entries in index.css and see the css class/id defined on your page for the mod menu items -- then create entries for each mod menu item in the css file)
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Dan_

Quote from: Kindred on June 01, 2015, 02:34:38 PM
Quote from: Dan_ on June 01, 2015, 12:52:27 PM
Thanks for the 2.0.10 update, and all your help.

You probably have the (?) icon because you have mods that add to your main menu and have not defined icons for those mods... (see the css entries in index.css and see the css class/id defined on your page for the mod menu items -- then create entries for each mod menu item in the css file)

Bingo!  Thanks for all your hard work...

hitsme

Quote from: Dan_ on June 01, 2015, 01:40:56 PM
Quote from: mossite on May 27, 2015, 04:18:14 PM
i tried to install this theme and got this in the picture. who can help please
The fixes for me were to take the 90% size out  of the forum width setting and leave that setting blank,

Rather

Quote from: roshaoar on May 21, 2015, 05:09:30 PM
Pass, I stayed with V3

Dan_

Quote from: Dan_ on June 01, 2015, 03:01:46 PM
Quote from: Kindred on June 01, 2015, 02:34:38 PM
Quote from: Dan_ on June 01, 2015, 12:52:27 PM
Thanks for the 2.0.10 update, and all your help.

You probably have the (?) icon because you have mods that add to your main menu and have not defined icons for those mods... (see the css entries in index.css and see the css class/id defined on your page for the mod menu items -- then create entries for each mod menu item in the css file)

I am unable to follow your instructions...  They are too abstract for my level of coding experience.  I need instructions that include the file names and locations.   Fire bug didn't seem to be any help and index.css does not seem to contain anything I can change.

A mod to take care of this would be great!

Thanks.


Kindred

my mistake...  responsive.css


.responsive_menu {
    background: rgba(0, 0, 0, 0) url("../images/responsive_menu.png") no-repeat scroll -5px -5px;
    display: inline-block;
    height: 16px;
    width: 16px;
}


and then each one


.responsive_menu.mlist {
    background-position: -57px -57px;
}


However I do suggest that you learn how to use firebug since it is an invaluable tool for a webmaster


finally...  please stop writing in large text?   
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Dan_

#168
I do thank you for your time.
I used firebug as you asked. Put an entry for .googlemap into responsive.css and expected to see 2 houses, if the pair of numbers in the entry is what makes the assignment.
Attachments...

Again, thanks.

Edit:

Progress! I had failed to save the file in file manager...  new snip below.   Also I edited the responsive_menu.jpg and put the globe in.  Now several globes...

Is there a method to the number pair madness?  The whole responsive_menu.jpg seems to be 104X104

Thanks.

Kindred

yes, it's called a sprite...  one image with the PART of the image to be displayed defined by CSS.
(load one 16x16 portion -- in this case, the portion which is 57px down, 57px across)

this means that the image itself only has to load ONCE and then any PART of it can be used without reloading the image...

you can add images into the sprite...  but make sure you add them in the correct location(s)
or you can use individual images instead of the sprite.

http://www.w3schools.com/css/css_image_sprites.asp
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Antes

no no no you don't have to replace, update the sprite just use the same format like

.responsive_menu.myaction {
background: url(../images/myaction.png/jpg) no-repeat;
}

Kindred

or you can add images into the sprite -- as I described... I prefer to do that myself and have done it for 3 sites...
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Antes

Quote from: Kindred on June 02, 2015, 01:44:03 PM
or you can add images into the sprite -- as I described... I prefer to do that myself and have done it for 3 sites...

I'll find the sprite code and write how-to about it. There is a much more easier way actually. :)

Dan_

#173
Quote from: Antes on June 02, 2015, 01:56:21 PM
I'll find the sprite code and write how-to about it. There is a much more easier way actually. :)

Icons all sorted via the sprite.  It would certainly be less brain strain for me to do it Ante's way.  But I was most the way through doing it Kindred's way.

The value in Kindred's way is the sprite loads with one server hit and you show the Icon you want...

Thanks everyone,  I am spent but very grateful for your attention to this.  And your patience with me.  You have taken one more brick out of the wall for me.

One last attachment...

Lazybones

Comments on beta 4.

- Some of my users don't like the fact that there is no time stamp visible for posts on mobile devices.
- On my iPhone at least the view port defaults to zoomed in instead of edge to edge. This seems a bit strange vs some mobile optimized sites.
- I have no idea what most of those little icon mean... I had to go back to the desktop version to figure it out.

Dan_

#175
Quote from: Lazybones on June 03, 2015, 09:32:38 PM
Comments on beta 4.

- Some of my users don't like the fact that there is no time stamp visible for posts on mobile devices.
- On my iPhone at least the view port defaults to zoomed in instead of edge to edge. This seems a bit strange vs some mobile optimized sites.
- I have no idea what most of those little icon mean... I had to go back to the desktop version to figure it out.

I am losing the time and date when restoring down to even a little more that tablet size.

Also, the newest member text is not responding at all.  It overlays on top of itself.

Edit:
Newest member text looks fine on cell phone... in Landscape still jambs in Portrait orientation.  It is jamming whenever restore down the desktop browser to near tablet size.  (Chrome) 

FireFox seems to be choking on Java or flash, so have abandoned it.

Dan_

Quote from: Dan_ on June 04, 2015, 02:04:37 PM

I am losing the time and date when restoring down to even a little more that tablet size.

Edit:
Newest member text looks fine on cell phone... in Landscape still jambs in Portrait orientation.  It is jamming whenever restore down the desktop browser to near tablet size.  (Chrome) 


screen capture attached.

Antes

@Dan_

Since that part is block (not divided with span etc element, nothing we can do actually, best is to hide it).

Dan_

Quote from: Antes on June 09, 2015, 01:13:45 PM
@Dan_

Since that part is block (not divided with span etc element, nothing we can do actually, best is to hide it).


Thanks for your attention and reply.


Firebug says it is a table in a div.  A one row table I suppose.

<table id="sp_main">
   <tbody>
      <tr>
         <td id="sp_center">
            <div id="index_common_stats">
                  Members: 659  •  Posts: 4655  •  Topics: 769 Please welcome
            <strong>
               <a href="http://www.eaglersnest.com/forum/index.php?action=profile;u=895">Racer46</a>
            </strong>
            , our newest member.
         <>


A google search makes it appear doable, I just am unable.

Kindred

You can't put a div inside a table... That is improper coding.
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Advertisement: