Link to the theme (http://custom.simplemachines.org/themes/index.php?lemma=2753)
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fcustom.simplemachines.org%2Fthemes%2Findex.php%2Faction%2Cdownload%2Flemma%2C2753%2Fimage%2Cthumb&hash=ba69efa02a081e935ac8a43caed1076b29dc9dab)
Detailed design emphasizes simplicity and comfort. Add a header image and the image below. So that the user can change the banner image of a user friendly interface. But still unique to the original structure of Simple Machines Forum "and it can be customized as needed".
You can change the header image and bottom image. / Themes / On the Beach / images / banner
;D New On the BeachV2
demo: On the BeachV2 (http://travel.xn--12cl9beo6cca1dl1hqc2p.com/index.php)
Download On the Beach V2 Free! (http://www.xn--12cl9beo6cca1dl1hqc2p.com/index.php?topic=1753.0)
Hi,
I changed the images for the top banner, footer and used an image as background for the main menu section but am having problems persuading these to resize when browsing the forum on mobile devices (Android phone and small iPad).
Please could you help me with the css?
The url for my test forum is http://cristinalciati.com/NewMRC1/
Thank you in advance :)
Crissy
Hello CrissyUK
The simplest solution You need to resize the forum as px.
sample
Size forum 90%
Change to 1240 px
Thanks.
Great theme! simplistic and easy on the eyes. i am new to smf. please let me know how to change the menu green and forum blue bars to red? tia.
Quote from: DEEPSNUYB on March 20, 2014, 05:10:07 AM
Great theme! simplistic and easy on the eyes. i am new to smf. please let me know how to change the menu green and forum blue bars to red? tia.
You must to edit the file index.css
*change the menu green
/* Styles for the standard dropdown menus.
------------------------------------------------------- */
#main_menu
{
background:#008899;
padding: 0 0.0em;
float: left;
margin: 0;
width: 100%;
padding-bottom:10px;
}editing " background:#008899; " To the color you want
*change the forum blue
/* Styles for rounded headers.
------------------------------------------------------- */
h3.catbg, h3.catbg2, h3.titlebg, h4.titlebg, h4.catbg
{
overflow: hidden;
height: 31px;
line-height: 31px;
font-size: 1.2em;
font-weight: bold;
}
h3.catbg a:link, h3.catbg a:visited, h4.catbg a:link, h4.catbg a:visited, h3.catbg, .table_list tbody.header td, .table_list tbody.header td a
{
color: #fff;
}
h3.catbg2 a, h3.catbg2
{
color: #feb;
}
h3.catbg a:hover, h4.catbg a:hover, .table_list tbody.header td a:hover
{
color: #fd9;
text-decoration: none;
}
h3.catbg2 a:hover
{
color: #fff;
text-decoration: none;
}
h3.titlebg a, h3.titlebg, h4.titlebg, h4.titlebg a
{
color: #FFF;
}
h3.titlebg a:hover, h4.titlebg a:hover
{
color: #53616f;
text-decoration: none;
}
h3.catbg img.icon, h4.titlebg img.icon
{
vertical-align: middle;
margin: -2px 5px 0 0;
}
h4.catbg a.toggle img
{
vertical-align: middle;
margin: -2px 5px 0 5px;
}
h4.catbg, h4.catbg2 , h3.catbg , h3.catbg2 , .table_list tbody.header td.catbg
{
background:#0080FF; url(../images/theme/main_block.png) no-repeat 100% -160px;
padding-right: 9px;
}
h4.titlebg, h3.titlebg
{
background:#0080FF; url(../images/theme/main_block.png) no-repeat 100% -200px;
padding-right: 9px;
}
h4.titlebg img.icon
{
float: left;
margin: 5px 8px 0 0;
}
div.cat_bar
{
background: #0080FF; url(../images/theme/main_block.png) no-repeat 0 -160px;
padding-left: 9px;
height: 31px;
overflow: hidden;
margin-bottom: 1px;
border-radius: 5px;
}
div.title_bar
{
background: #0080FF; url(../images/theme/main_block.png) no-repeat 0 -200px;
padding-left: 9px;
height: 31px;
overflow: hidden;
margin-bottom: 1px;
border-radius: 5px;
}
/* rounded bars needs a different background here */editing " background: #0080FF; " To the color you want
Thank you for using my theme.
Quote from: Mr.Truckman on March 20, 2014, 06:39:26 AM
Thank you for using my theme.
Thank you for allowing us to use it.
Hi. just wanted to let you know i made the changes. the only head bars that did not change colors were the Forum Stats and Users Online bars. They are still the blue car colors?
:D You can customize as needed.
I just do not remove credit! If you want to remove credit Please contact me
Thanks
Nice theme! Very awesome guy.
would it be possible to enlarge the header and the nav menu to be at 100% and the div (which is the section below the nav menu) to be at 90%? Just like this theme
http://custom.simplemachines.org/themes/index.php?lemma=2484
Thank you
Hi, love the theme. Can you add link to menu bar?
Quote from: Capn Ryno on April 08, 2014, 05:24:46 AM
Hi, love the theme. Can you add link to menu bar?
This mod will help you. http://custom.simplemachines.org/mods/index.php?mod=3249
Mr. Truckman, is there no way that could be done?
would it be possible to enlarge the
header and the nav menu to be at
100% and the div (which is the section
below the nav menu) to be at 90%?
Just like this theme http://custom.simplemachines.org/themes/index.php?lemma=2484
please sir i need your help
Quote from: mulwa on April 18, 2014, 03:42:06 PM
Mr. Truckman, is there no way that could be done?
would it be possible to enlarge the
header and the nav menu to be at
100% and the div (which is the section
below the nav menu) to be at 90%?
Just like this theme http://custom.simplemachines.org/themes/index.php?lemma=2484
please sir i need your help
You need to edit the file. index.css
Find:
/* the content section */
#content_section
{
background: #FFFFFF; url(../images/theme/frame_repeat.png) repeat-y top left;
padding-left: 10px;
}
#content_section div.frame
{
background:#FFFFFF; url(../images/theme/frame_repeat.png) repeat-y top right;
display: block;
padding: 0 10px 0 0;
}
#main_content_section
{
width: 100%;
min-height: 200px;
}
Replace With:
/* the content section */
#content_section
{
background: #FFFFFF; url(../images/theme/frame_repeat.png) repeat-y top left;
padding-left: 40px;
}
#content_section div.frame
{
background:#FFFFFF; url(../images/theme/frame_repeat.png) repeat-y top right;
display: block;
padding: 0 40px 0 0;
}
#main_content_section
{
width: 100%;
min-height: 200px;
}
Mr. Truck man, thank you, that worked for me.
Is there anyway i can make the logo to be centered just like the screenshot below?
And also i would like the user info and the search box to be at the right hand side with the logo at the left hand side for different website. Cause i wanna use this theme on two websites with different header arrangement. Thank you sir
;D New On the BeachV2
demo: On the BeachV2 (http://travel.xn--12cl9beo6cca1dl1hqc2p.com/index.php)
Download On the Beach V2 Free! (http://www.xn--12cl9beo6cca1dl1hqc2p.com/index.php?topic=1753.0)
No help for me on the header section. Anyway,
that link of the new theme is not going.
firstly, thanks for a great theme :)
i have a small problem in that the header image i use has a dark background colour, where the "log in" etc text appears, which makes the text hard to view,
what do i need to change in the 'themes/on the beach/css/index.css' file to change the colours of the text shown in the attached pics , to a lighter colour to aid visibility?
e:g the "log in" and "register" are dark blue/red
and in the 2nd pic, "show unread posts ......." etc are dark blue/red
i 'm assuming that index.css is the right file to modify, but i can't find any reference to those sections in the file,
any pointers most welcome :-[
Hi Mr Truckman
Firstly, great theme, really easy to change headers and borders and such. Just a quick question I would like to add an background image to the website, could you tell me how to do this please.
Thanks in advance
Quote from: ashter on March 22, 2015, 10:27:18 AM
firstly, thanks for a great theme :)
i have a small problem in that the header image i use has a dark background colour, where the "log in" etc text appears, which makes the text hard to view,
what do i need to change in the 'themes/on the beach/css/index.css' file to change the colours of the text shown in the attached pics , to a lighter colour to aid visibility?
e:g the "log in" and "register" are dark blue/red
and in the 2nd pic, "show unread posts ......." etc are dark blue/red
i 'm assuming that index.css is the right file to modify, but i can't find any reference to those sections in the file,
any pointers most welcome :-[
in the absence of any replys to this, i have tried changing colours in the index.css files, but not hit on the right part yet ,
so am i looking in the right file with index.css or not ?
if any one can point me in the right direction here it would be much apprciated, :-[
ashter.
Quote from: ashter on March 22, 2015, 10:27:18 AM
firstly, thanks for a great theme :)
i have a small problem in that the header image i use has a dark background colour, where the "log in" etc text appears, which makes the text hard to view,
what do i need to change in the 'themes/on the beach/css/index.css' file to change the colours of the text shown in the attached pics , to a lighter colour to aid visibility?
e:g the "log in" and "register" are dark blue/red
and in the 2nd pic, "show unread posts ......." etc are dark blue/red
i 'm assuming that index.css is the right file to modify, but i can't find any reference to those sections in the file,
any pointers most welcome :-[
Hello,ashter
You must edit File /themes/on the beach/css/index.css
Find:
#upper_section
{
padding: 5px;
margin-bottom: 1.5em;
}Replace With:
#upper_section a
{
color:#FF0000;
padding: 5px;
margin-bottom: 1.5em;
}Thank you! :)
Quote from: Mr.Truckman on April 26, 2015, 10:55:45 AM
Quote from: ashter on March 22, 2015, 10:27:18 AM
firstly, thanks for a great theme :)
i have a small problem in that the header image i use has a dark background colour, where the "log in" etc text appears, which makes the text hard to view,
what do i need to change in the 'themes/on the beach/css/index.css' file to change the colours of the text shown in the attached pics , to a lighter colour to aid visibility?
e:g the "log in" and "register" are dark blue/red
and in the 2nd pic, "show unread posts ......." etc are dark blue/red
i 'm assuming that index.css is the right file to modify, but i can't find any reference to those sections in the file,
any pointers most welcome :-[
Hello,ashter
You must edit File /themes/on the beach/css/index.css
Find:
#upper_section
{
padding: 5px;
margin-bottom: 1.5em;
}
Replace With:
#upper_section a
{
color:#FF0000;
padding: 5px;
margin-bottom: 1.5em;
}
Thank you! :)
Hi and many thanks for the solution :D
i was looking for a specific colour to change, so i would never have found that :-[
i applied the change and its now showing the tex much clearer :)
just made a great theme even better :)
Ashter,
Quote from: ashter on April 27, 2015, 01:04:48 PM
Quote from: Mr.Truckman on April 26, 2015, 10:55:45 AM
Quote from: ashter on March 22, 2015, 10:27:18 AM
firstly, thanks for a great theme :)
i have a small problem in that the header image i use has a dark background colour, where the "log in" etc text appears, which makes the text hard to view,
what do i need to change in the 'themes/on the beach/css/index.css' file to change the colours of the text shown in the attached pics , to a lighter colour to aid visibility?
e:g the "log in" and "register" are dark blue/red
and in the 2nd pic, "show unread posts ......." etc are dark blue/red
i 'm assuming that index.css is the right file to modify, but i can't find any reference to those sections in the file,
any pointers most welcome :-[
Hello,ashter
You must edit File /themes/on the beach/css/index.css
Find:
#upper_section
{
padding: 5px;
margin-bottom: 1.5em;
}
Replace With:
#upper_section a
{
color:#FF0000;
padding: 5px;
margin-bottom: 1.5em;
}
Thank you! :)
Hi and many thanks for the solution :D
i was looking for a specific colour to change, so i would never have found that :-[
i applied the change and its now showing the tex much clearer :)
just made a great theme even better :)
Ashter,
Hello,ashter
Responsive Curve for SMF 2.0.x It is a very good mod that you should install it. http://custom.simplemachines.org/mods/index.php?mod=4040