MyBB Community Forums

MyBB Community Forums > Extensions > Themes > Theme Support > New Theme
Full Version: New Theme
You're currently viewing a stripped down version of our content. View the full version with proper formatting.

Legend HH

2011-05-20, 11:14 AM
To create a new theme we need to use the PHP code right? So is this a right one- 

body {
	color: #000;
	background-image: url('http://i56.tinypic.com/245t3.png');
	text-align: center;
	line-height: 1.4;
	margin-top: 0;
	margin-bottom: 25px;
	
	font-family: Tahoma, Verdana, Arial, Sans-Serif;
	font-size: 13px;
}

a:link {
    color: #023659;

    text-decoration: none;
}

a:visited {
    color: #023659;

    text-decoration: none;
}

a:hover, a:active {
    color: #000;

    text-decoration: underline;
}

#container {
    background: #fff;

    width: 92%;

    color: #000000;

    border: 1px solid #000;

    border-top: 0;

    margin: auto auto;

    text-align: left;
}

.logo {
    background: url(images/midnight/logo_bg.png) top left repeat-x;

    border-bottom: 1px solid #000;

    min-height: 100px;
}

#content {
    width: auto !important;

    padding: 20px;
}

.menu ul {
    color: #000000;

    font-weight: bold;

    text-align: right;

    padding: 4px;
}

.menu ul a:link {
    color: #000000;

    text-decoration: none;
}

.menu ul a:visited {
    color: #000000;

    text-decoration: none;
}

.menu ul a:hover, .menu ul a:active {
    color: #4874a3;

    text-decoration: none;
}

#panel {
    background: #efefef;

    color: #000000;

    font-size: 11px;

    border: 1px solid #D4D4D4;

    padding: 8px;
}

.upper_panel {
    background: #1B1C1B url(images/midnight/tcat_bg.png) top left repeat-x;

    color: #fff;

    border-bottom: 1px solid #000;

    padding: 7px;
}

.upper_panel a {
    color: #fff;

    padding-left: 20px;

    margin-right: 15px;

    

    font-weight: bold;
}

.upper_panel a.search {
    background: url(images/midnight/icons/search.gif) no-repeat;
}

.upper_panel a.memberlist {
    background: url(images/midnight/icons/memberlist.gif) no-repeat;
}

.upper_panel a.calendar {
    background: url(images/midnight/icons/calendar.gif) no-repeat;
}

.upper_panel a.help {
    background: url(images/midnight/icons/help.gif) no-repeat;

    margin-right: 0;
}

.upper_panel a.login {
    background: url(images/midnight/icons/login.gif) no-repeat;

    margin-left: 10px;
}

.upper_panel a.register {
    background: url(images/midnight/icons/register.gif) no-repeat;
}

.upper_panel a.logout {
    background: url(images/midnight/icons/logout.gif) no-repeat right;

    padding-right: 20px;

    margin-left: 10px;

    padding-left: 0;

    margin-right: 0;
}

.lower_panel a.admincp {
    background: url(images/midnight/icons/admincp.gif) no-repeat;

    padding-left: 20px;
}

.lower_panel a.modcp {
    background: url(images/midnight/icons/modcp.gif) no-repeat;

    padding-left: 20px;
}

.lower_panel a.usercp {
    background: url(images/midnight/icons/usercp.gif) no-repeat;

    padding-left: 20px;
}

.lower_panel {
    background: #efefef;

    color: #888888;

    border-bottom: 1px solid #ccc;

    padding: 6px;
}

.lower_panel a {
    color: #626262;

    margin-right: 15px;
}

.lower_panel a:hover,

.lower_panel a:active {
    text-decoration: none;

    color: #000;
}

table {
    color: #000000;

    font-family: Tahoma, Verdana, Arial, Sans-Serif;

    font-size: 13px;
}

.tborder {
    background: #fff;

    width: 100%;

    margin: auto auto;

    border: 1px solid #000;
}

.thead {
    background: #02253E url(images/midnight/thead_bg.png) top left repeat-x;

    color: #fff;

    border-bottom: 1px solid #00101b;
}

.thead a:link {
    color: #fff;

    text-decoration: none;
}

.thead a:visited {
    color: #fff;

    text-decoration: none;
}

.thead a:hover, .thead a:active {
    color: #fff;

    text-decoration: underline;
}

.tcat {
    background: #1B1C1B url(images/midnight/tcat_bg.png) top left repeat-x;

    color: #fff;

    border-bottom: 1px solid #000;
}

.tcat a:link {
    color: #fff;
}

.tcat a:visited {
    color: #fff;
}

.tcat a:hover, .tcat a:active {
    color: #fff;
}

.trow1 {
    background: #f5f5f5;

    border-bottom: 1px solid #e6e6e6;
}

.trow2 {
    background: #EFEFEF;

    border-bottom: 1px solid #e0e0e0;
}

.trow_shaded {
    background: #ffdde0;
}

.trow_selected td {
    background: #FFFBD9;

    border-bottom: 1px solid #F7E86A;

    color: #000;
}

.trow_selected td a,

.trow_selected td a:link,

.trow_selected td a:visited,

.trow_selected td a:hover,

.trow_selected td a:active {
    color: #000;
}

.trow_sep {
    background: #e5e5e5;

    color: #000;

    font-size: 12px;

    font-weight: bold;
}

.tfoot {
    background: #094772;

    color: #ffffff;

    border-top: 1px solid #000d15;
}

.tfoot a:link {
    color: #ffffff;

    text-decoration: none;
}

.tfoot a:visited {
    color: #ffffff;

    text-decoration: none;
}

.tfoot a:hover, .tfoot a:active {
    color: #ffffff;

    text-decoration: underline;
}

.bottommenu {
    background: #1B1C1B url(images/midnight/tcat_bg.png) top left repeat-x;

    color: #fff;

    border-top: 1px solid #000;

    padding: 6px;
}

.bottommenu div span.smalltext a {
    color: #fff;

    margin-right: 15px;
}

.navigation {
    color: #000000;

    font-size: 11px;

    font-weight: bold;
}

.navigation a:link {
    color: #035084;

    text-decoration: none;
}

.navigation a:visited {
    color: #035084;

    text-decoration: none;
}

.navigation a:hover, .navigation a:active {
    color: #000;

    text-decoration: none;
}

.navigation .active {
    color: #000000;

    font-size: small;

    font-weight: bold;
}

.smalltext {
    font-size: 11px;
}

.largetext {
    font-size: 16px;

    font-weight: bold;
}

input.textbox {
    background: #ffffff;

    color: #000000;

    border: 1px solid #888888;

    padding: 3px;

    

    font-family: Tahoma, Verdana, Arial, Sans-Serif;
}

textarea {
    background: #ffffff;

    color: #000000;

    border: 1px solid #888888;

    padding: 2px;

    line-height: 1.4;

    

    font-family: Tahoma, Verdana, Arial, Sans-Serif;

    font-size: 13px;
}

select {
    background: #ffffff;

    border: 1px solid #888888;

    padding: 2px;

    font-family: Tahoma, Verdana, Arial, Sans-Serif;
}

input.textbox:focus,

textarea:focus,

select:focus {
    border: 1px solid #000;
}

input[type=submit] {
    font-family: Tahoma, Verdana, Arial, Sans-Serif;

    font-weight: bold;
}

.editor {
    background: #f1f1f1;

    border: 1px solid #ccc;
}

.editor_control_bar {
    background: #fff;

    border: 1px solid #0f5c8e;
}

.autocomplete {
    background: #fff;

    border: 1px solid #000;

    color: black;
}

.autocomplete_selected {
    background: #034877;

    color: #fff;
}

.popup_menu {
    background: #fff;

    border: 1px solid #000;
}

.popup_menu .popup_item {
    background: #efefef;

    color: #000;
}

.popup_menu .popup_item:hover {
    background: #034877;

    color: #fff;
}

.trow_reputation_positive {
    background: #ccffcc;
}

.trow_reputation_negative {
    background: #ffcccc;
}

.reputation_positive {
    color: green;
}

.reputation_neutral {
    color: #444;
}

.reputation_negative {
    color: red;
}

.invalid_field {
    border: 1px solid #f30;

    color: #f30;
}

.valid_field {
    border: 1px solid #0c0;
}

.validation_error {
    background: url(images/midnight/invalid.gif) no-repeat center left;

    color: #f30;

    margin: 5px 0;

    padding: 5px;

    font-weight: bold;

    font-size: 11px;

    padding-left: 22px;
}

.validation_success {
    background: url(images/midnight/valid.gif) no-repeat center left;

    color: #00b200;

    margin: 5px 0;

    padding: 5px;

    font-weight: bold;

    font-size: 11px;

    padding-left: 22px;
}

.validation_loading {
    background: url(images/midnight/spinner.gif) no-repeat center left;

    color: #555;

    margin: 5px 0;

    padding: 5px;

    font-weight: bold;

    font-size: 11px;

    padding-left: 22px;
}

/* Additional CSS (Master) */
img {
    border: none;
}

.clear {
    clear: both;
}

.hidden {
    display: none;

    float: none;

    width: 1%;
}

.float_left {
    float: left;
}

.float_right {
    float: right;
}

.menu ul {
    list-style: none;

    margin: 0;
}

.menu li {
    display: inline;

    padding-left: 5px;
}

.menu img {
    padding-right: 5px;

    vertical-align: top;
}

#panel .links {
    margin: 0;

    float: right;
}

.expcolimage {
    width: auto;

    float: right;

    vertical-align: middle;

    margin-top: 2px;
}

img.attachment {
    border: 1px solid #E9E5D7;

    padding: 2px;
}

hr {
    background-color: #000000;

    color: #000000;

    height: 1px;

    border: 0px;
}

#copyright {
    background: #02253E url(images/midnight/thead_bg.png) top left repeat-x;

    color: #fff;

    margin: 0;

    padding: 6px;

    border-top: 1px solid #00101b;
}

#copyright a {
    color: #fff;
}

#debug {
    float: right;

    text-align: right;

    margin-top: 0;
}

blockquote {
    border: 1px solid #ccc;

    margin: 0;

    background: #fff;

    padding: 4px;
}

blockquote cite {
    font-weight: bold;

    border-bottom: 1px solid #ccc;

    font-style: normal;

    display: block;

    margin: 4px 0;
}

blockquote cite span {
    float: right;

    font-weight: normal;
}

.codeblock {
    background: #fff;

    border: 1px solid #ccc;

    padding: 4px;
}

.codeblock .title {
    border-bottom: 1px solid #ccc;

    font-weight: bold;

    margin: 4px 0;
}

.codeblock code {
    overflow: auto;

    height: auto;

    max-height: 200px;

    display: block;

    font-family: Monaco, Consolas, Courier, monospace;

    font-size: 13px;
}

.subforumicon {
    border: 0;

    vertical-align: middle;
}

.separator {
    margin: 5px;

    padding: 0;

    height: 0px;

    font-size: 1px;

    list-style-type: none;
}

form {
    margin: 0;

    padding: 0;
}

.popup_menu .popup_item_container {
    margin: 1px;

    text-align: left;
}

.popup_menu .popup_item {
    display: block;

    padding: 3px;

    text-decoration: none;

    white-space: nowrap;
}

.popup_menu a.popup_item:hover {
    text-decoration: none;
}

.autocomplete {
    text-align: left;
}

.subject_new {
    font-weight: bold;
}

.highlight {
    background: #FFFFCC;

    padding: 3px;
}

.pm_alert {
    background: #FFF6BF;

    border: 1px solid #FFD324;

    text-align: center;

    padding: 5px 20px;

    font-size: 11px;
}

.red_alert {
    background: #FBE3E4;

    border: 1px solid #A5161A;

    color: #A5161A;

    text-align: center;

    padding: 5px 20px;

    font-size: 11px;
}

.high_warning {
    color: #CC0000;
}

.moderate_warning {
    color: #F3611B;
}

.low_warning {
    color: #AE5700;
}

div.error {
    padding: 5px 10px;

    border-top: 2px solid #FFD324;

    border-bottom: 2px solid #FFD324;

    background: #FFF6BF;

    font-size: 12px;
}

div.error p {
    margin: 0;

    color: #000;

    font-weight: normal;
}

div.error p em {
    font-style: normal;

    font-weight: bold;

    padding-left: 24px;

    display: block;

    color: #C00;

    background: url(images/midnight/error.gif) no-repeat 0;
}

div.error.ul {
    margin-left: 24px;
}

.online {
    color: #15A018;
}

.offline {
    color: #C7C7C7;
}

.pagination {
    font-size: 11px;

    padding-top: 10px;

    margin-bottom: 5px;
}

.tfoot .pagination, .tcat .pagination {
    padding-top: 0;
}

.pagination .pages {
    font-weight: bold;
}

.pagination .pagination_current, .pagination a {
    padding: 2px 6px;

    margin-bottom: 3px;
}

.pagination a {
    background: #efefef;

    border: 1px solid #ccc;
}

.pagination .pagination_current {
    background: #efefef;

    border: 1px solid #ccc;

    

    font-weight: bold;
}

.pagination a:hover {
    background: #034877;

    color: #fff;

    border: 1px solid #023253;

    text-decoration: none;
}

.thread_legend, .thread_legend dd {
    margin: 0;

    padding: 0;
}

.thread_legend dd {
    padding-bottom: 4px;

    margin-right: 15px;
}

.thread_legend img {
    margin-right: 4px;

    vertical-align: bottom;
}

.forum_legend, .forum_legend dt, .forum_legend dd {
    margin: 0;

    padding: 0;
}

.forum_legend dd {
    float: left;

    margin-right: 10px;
}

.forum_legend dt {
    margin-right: 10px;

    float: left;
}

.success_message {
    color: #00b200;

    font-weight: bold;

    font-size: 10px;

    margin-bottom: 10px;
}

.error_message {
    color: #C00;

    font-weight: bold;

    font-size: 10px;

    margin-bottom: 10px;
}

.post_body {
    padding: 5px;
}

.post_content {
    padding: 5px 10px;
}

.quick_jump {
    background: url(images/jump.gif) no-repeat 0;

    width: 13px;

    height: 13px;

    padding-left: 13px; /* amount of padding needed for image to fully show */

    vertical-align: middle;

    border: none;
}

fieldset,

fieldset.trow1,

fieldset.trow2 {
    background: #ededed;

    border: 1px solid #ccc;
}

That PHP code did change my forums background. Is this correct?

Tomm M

2011-05-20, 11:38 AM
You can't use PHP in a CSS file.

Why do you need to use PHP to make a new theme exactly?

Legend HH

2011-05-20, 11:49 AM
I know that I can't use a PHP code in a CSS file, but it did change my forums background, is it because of the PHP code? Or was it something else? I just want to ask is it because of the code? If thats not it, then how do I add a new theme, MyBB shine?

Tomm M

2011-05-20, 12:39 PM
You typically import the theme's XML file to the Templates & Style section of the ACP and upload the images it requires based on the author's instructions.

I don't quite understand how you would have used PHP code to change the forum's background.

Legend HH

2011-05-20, 01:47 PM
So, where can I find the XML file or MyBB shine theme?

Euan T

2011-05-20, 01:50 PM
You want to download the MyBB Shine theme? Download it from the mods DB, upload the images and import the .xml file in the package...

Legend HH

2011-05-20, 02:42 PM
Great, thanks, it really changed the theme. Lock this thread please!
MyBB Community Forums > Extensions > Themes > Theme Support > New Theme