<div id="port-block1" class="saled">

<a class="tip" id="cover" title="Detailed design of a modern blog site on the basis of free forums MyBB.ru">
  <div id="icon"></div>
  <img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/MyBBF_COVER.jpg" class="postimg">

<div id="cover-block">
Date: 20.09.2015<br>
Creators: <a href="http://forumd-eng.ru/profile.php?id=2" target="_blank">Gerda</a><br>
Engine: MyBB<br>
Description: Detailed design of a modern blog site on the basis of free forums MyBB.ru<br>
<a href="http://magiclibrary.0pk.ru/" target="_blank">DEMO</a><br><br>



<div id="port-block2"  class="saled">
<a class="tip" title="Main Page: side bar, style of categories"><img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/MyBBF_1.jpg" class="postimg"></a>

<a class="tip" title="View forum Page: descriptions of topics, the selection of different types of topics"><img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/MyBBF_2.jpg" class="postimg"></a>

<a class="tip" title="View topic Page: blog design of the user profile, replacement of the links management topic on the icons, etc."><img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/MyBBF_3.jpg" class="postimg"></a>

<a class="tip" title="Sticky post on the pages of the topic"><img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/MyBBF_4.jpg" class="postimg"></a>

<a class="tip" title="Enabled "Full profile" in messagesї style setting"><img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/Decr_MyBBF_9.jpg" class="postimg"></a>

<a class="tip" title="Style of quote and code boxes"><img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/MyBBF_7.jpg" class="postimg"></a>

<a class="tip" title="Full submit form, displaying the latest posts of the topic"><img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/MyBBF_9.jpg" class="postimg"></a>

<a class="tip" title="Style of private messages page"><img src="http://gerda.moy.su/MyBB_files/FD/MyBBF/MyBBF_11.jpg" class="postimg"></a>

.punbb .topicpost .post-content .spoiler-box {
border: 1px solid #e63737;
background-color: rgba(230,55,55,0.1);
.punbb .post-content .spoiler-box > div:hover {background-color: rgba(230,55,55,0.6);}
.punbb .post-content .spoiler-box > div {background-color: rgba(230,55,55,0.3);}
.post-content .spoiler-box > div.visible {background-color: rgba(230,55,55,0.8);}

detailed description

Design MyBB Bright Flat - is an imitation of a modern blog site on the basis of free forums MyBB.ru.
In fact, it assembled a huge set of original design solutions for the forum, changing the standard forum beyond recognition.
Also, the style works on the basis of unique scripts that help in modifying the forum, in particular, a remaded style change script, which includes not only a standard switch, but also the option of optionally connecting several additional styles simultaneously.

Main Page of the forum
http://s3.uploads.ru/t/T4mpo.jpg http://s2.uploads.ru/t/7x9Qw.jpg
• Original style forum categories in the form of consecutive blocks
• Style for categories with new messages and redirects
• Ability to insert large descriptions with autoscroll content
• The number of topics and posts is rendered down the block and styled with icons
• A link to the last message appears when you hover over the description of the section
• Original style of statistics
• Animating smooth appearance of categories when scrolling the page (optional)

Side bar: change styles, forum menu, user-panel, additional options
http://s2.uploads.ru/t/odg6C.jpg http://s7.uploads.ru/t/HfsUr.jpg
• On the right is a fixed side bar with the standard functionality of the engine and additional scripts.
• The sidebar includes links to the main page, the navigation menu, the user menu, the user panel, additional options, scrolling the page upwards.
• Side bar links are styled when you hover over the cursor. When the item is selected, the forum lights up, highlighting the selected menu.
• The scroll up arrow only appears on long pages when the user drops down.
• Each menu is highlighted in its own color, menu items have a style when you hover the cursor.
• In addition to the navigation menu, there is a built-in quick search script for the forum.
• User-panel is presented in two options: for forum guests (with suggestions to register) and for forum members (with profile settings and statistics).
• Additional options include a PR-link script and a menu of optional plug-in styles:
       • i]Enable / Disable stats[/i] - removes / returns the block of statistics on the main of forum and the number of topics/posts/views in the forum sections.
       • Enable / Disable animation - displays a smooth animation of the appearance of content when scrolling pages.
       • Full profile in posts - Turns off/on the display of the full profile to the right of the message (as on the standard design for the forum).
       • Other settings - link to Profile page > Options
• All styles in the additional options work simultaneously with each other, unlike the standard switch.
• The optional full profile style works correctly not only in posts, but also on search pages, post previews and private messages.

View Forum Page
http://s2.uploads.ru/t/GhYLc.jpg http://s2.uploads.ru/t/E7Sj0.jpg
• The list of topics is also designed in the form of consecutive blocks.
• Each type of topic has its own style of design: closed, important, important-closed, etc.
• Inscriptions of topics ("closed", "important", "new messages") are replaced with icons.
• Stylized links to new messages and creating new topics/polls.
• The number of posts and views, as well as the author of the topic are taken down the block and styled with icons.
• Built and stylized topic description script.
• The link to the last message appears when you hover over the topic description.
• Added a unique pagination style for pages.
• Animating the smooth appearance of topics when scrolling the page.

View Topic Page and Posts
http://s7.uploads.ru/t/umdnW.jpg http://s2.uploads.ru/t/0KWLF.jpg
• The original design of "bread crumbs", the navigator itself works only on the pages, in-depth in two or more links.
• Stylized pagination by pages and the new post link.
• The module of recommendations on the partner QuadroBoards (RusFF) is issued.
• The module "Related Topics" from MyBB and a similar module from the QuadroBoards affiliate (RusFF) are designed, their compatibility and simultaneous operation are ensured.
• Unique design of the "Tags" module for the QuadroBoards forums (RusFF).
• Built-in default avatar script.
• Original design of reputation change and message rating
• Smooth appearance of messages when scrolling the page
http://s2.uploads.ru/t/pdlKt.jpg http://s3.uploads.ru/t/0j9Ca.jpg
• A unique style of the post for the function "Fix first post on every page of topic".
• In all topics the first post differs in style, the rest have indentation and framing (imitation of comments to the article as on blog sites)
http://s3.uploads.ru/t/Mo4pf.jpg http://s6.uploads.ru/t/17FjX.jpg
• By default on the forum the horizontal profile:
     • avatars are strictly fixed in size through style;
     • original design of the user's reputation;
     • built-in script activity indicator;
     • the profile links are above the message text;
     • for guests, status is displayed instead of profile links;
• The message control buttons are located above the text of the post.
• When the optional "Full profile" option is enabled, the author's profile becomes to the right of the post text, the profile link and message control are transferred to the post text.
• Set style of the "Share" module for the QuadroBoards forums (RusFF).
• Original design of modules QuadroBoards (RusFF) "Complaints", "Reputation" and "Graffiti"

http://s7.uploads.ru/t/c1eam.jpg http://s6.uploads.ru/t/pMQnX.jpg http://s6.uploads.ru/t/JNKvV.jpg
• A unique style of text formatting for blocks of code, quotes, spoilers and tables is specified.

Post Preview
http://s3.uploads.ru/t/m5ACP.jpg http://s3.uploads.ru/t/JVW5A.jpg
• Styling the post preview page.
• Corrected standard submit form style.
• Original style of posts on the preview page with alternating shades.
• Animating the smooth appearance of messages on the preview page when scrolling the page.
• Highlighting the last post on the preview page with a unique style.

Private messages
http://s6.uploads.ru/t/Je3yv.jpg http://s7.uploads.ru/t/T5Xz7.jpg http://s3.uploads.ru/t/uvFjQ.jpg http://s3.uploads.ru/t/b2G0a.jpg
• Our branded styling of the Personal messages page with several additions.
• The horizontal menu on the page of personal messages, while the standard editing page remained on the profile editing page (vertical menu).
• Original styling of the folders menu and the message management menu.
• Highlight new messages.
• The optional "full profile" function works correctly on the Personal messages pages.

Other pages
http://s2.uploads.ru/t/pRXob.jpg http://s7.uploads.ru/t/GhT1W.jpg
• The style is set in the user list and other forum tables.
• Original design of the user profile page.
• Stylized search and the animation of the smooth appearance of posts on the search result pages.