Ակումբի ձեւավորման փոփոխում (վերականգնում)

[Rammstein]

vBullein 4 համակարգով կայքերը որոշ բրաուզերներում պատկերվում են ոչ լիարժեք: Մասնավորապես անկյունների կլորություններն ու բլոկների ստվերները որոշ բրաուզերների համար չեն հարմարեցվել:

Թերեւս ամենալիարժեքը պատկերում է Mozilla Firefox-ը:


Օրինակ` այս անկյունների կլորությունները ցույց է տալիս միայն Firefox-ը:

Հետո գալիս են Google Chrome-ն ու Safari-ն, որոնք մի քանի տեղ թերանում են:

Վերջում գալիս են Opera-ն ու Internet Explorer-ը, որոնց մասին vBulletin-ի ծրագրավորողները, կարծես, չեն էլ մտածել, քանի որ վերջիններս չեն պատկերում ոչ մի ստվեր, ու բոլոր անկյուններն ուղիղ են երեւում:


Իսկ հիմա անցնենք բուն նյութին:

Օգտագործո՞ւմ եք Opera բրաուզերը: Ցանկանո՞ւմ եք տեսնել «Դար» Ակումբը իր ողջ գեղեցկությամբ: Դե կարդացեք շարունակությունը:
Երեկ պատահաբար մի Extension հանդիպեցի, ու որոշեցի դրա օգնությամբ իրագործել vBulletin-ի մասնագետների չիրագործած մասը Opera-ի համար: Էքսթենշնի աշխատանքի սկզբունքը ավելի քան պարզ է. այն ընդամենը թույլ է տալիս ուզած կայքին ավելացնել css ոճեր:
Իսկ համապատասխան css-ները ինքս դուրս բերեցի ու հարմարեցրի Opera-ին:

Դե ուրեմն սկսենք.
1. Տեղակայում ենք Include CSS extension-ը:
2. Բացում ենք www.akumb.am-ը:
3. Սեղմում ենք Extension-ի կոճակը (սովորաբար` վերին աջ անկյունում):
4. Սեղմում ենք New CSS կոճակը:
5. Վերին տողում լրացնում ենք անունը, օրինակ` Radius, իսկ ներքեւում պատճենում ենք հետեւյալ կոդը ու սեղմում` Save.

.bbcode_container div.bbcode_quote {
	border-radius: 5px;
}

.bbcode_quote div.quote_container {
	border-radius: 5px;
}

.editor_controls .popupmenu .popupbody li > a {
	border-radius: 0;
}

.blockfoot .popupctrl {
	border-radius: 0px;
}

.memberaction_body.popupbody {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.body_wrapper {
	border-radius: 5px;
}

.forumhead {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.button {
	border-radius: 0px;
}

.collapse {
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
}

.blockhead {
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
}

.textcontrols a,
a.textcontrol {
	border-radius: 0px;
}

* html .navpopupmenu.popupmenu.nohovermenu a.textcontrol, .navpopupmenu a.textcontrol, .navpopupmenu a.popupctrl, .navpopupmenu.popupmenu.nohovermenu a.textcontrol, .navpopupmenu.popupmenu.nohovermenu a.popupctrl {
	border-radius: 0px;
}

dl.tabslight dd a {
	border-top-left-radius: 5px;
	border-top-right-radius: 11px;
}

blockquote.preview .bbcode_container div.bbcode_quote {
	border-radius: 5px;
}

blockquote.preview .bbcode_quote div.quote_container {
	border-radius: 5px;
}

.attachments {
	border-radius: 5px;
}

#ajax_post_errors {
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
}

.above_body {
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.toplinks ul.nouser li a{
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.toplinks .logindetails {
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.notifications {
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.navbar {
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.navtabs ul {
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.navtabs li.selected li a.popupctrl {
	border-radius: 3px;	
}

.toplinks .notifications a.popupctrl {
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

.breadcrumb .navbit > a, .breadcrumb .lastnavbit > span {
	border-radius: 5px;	
}

.breadcrumb .navbit a.popupctrl {
	border-radius: 3px;
}

.textbox,
textarea,
select {
	border-radius: 3px;
}

.config_customize {
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
}

.config_editlink {
	border-radius: 5px;
}

.config_save {
	border-radius: 5px;
}

.config_customize_pages {
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
}
.config_customize_page {
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
}

.newcontent_textcontrol {
	border-radius: 10px;
}
.picker{
	background: -o-linear-gradient(#eeeeee,#999999);
}

.lightgraybackground{
	background: -o-linear-gradient(#ffffff,#cccccc);
}

.alert_box
{
	background: -o-gradient( linear, 0 0, 0 100%, from(#ffffff), to(#888888) );
	border-radius: 10px;
	z-index: 10;
}

.alert_box .hd
{
	border-radius: 10px;
}

.alert_box .bd
{
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.alert_box .ft input.btn {
	border-radius: 5px;
}

.ok_button {
border-radius: 5px;
}

.attach_popup
{
	border-radius: 5px;
}

.globalsearch .textboxcontainer span {
	border-top: 1px solid #365f7c;
	border-left: 1px solid #365f7c;
}

#sidebar_container .blockrow {
border-radius: 5px;
}

#sidebar_container .widget_content {
border-radius: 5px;
}

.mini_stats {
	border-radius: 5px;
}

#sidebar {
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}

.pollresultsblock {
	border-radius: 5px;
}

div#content_container
div.block {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

#searchtypeswitcher li a {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

div#usercp_nav
div.block {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}
div#blog_sidebar_generic
.block {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

div#blog_sidebar_generic {
	border-radius: 5px;
}

#pagetitle a.pagetitleinfo.textcontrol, .actionbutton_container a.pagetitleinfo.textcontrol {
border-radius: 10px;
box-shadow: 0 3px 8px #DDD;
}

#whatsnewsidebar div.blocksubhead.smaller a, #whatsnewsidebar div.blocksubhead.smaller span

.blogitems li ,span {
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
}

#sidebar_container .blockbody {
border-radius: 5px;
}

dd.userprof_module, dd.userprof_moduleinactive, dd.userprof_content, dd.userprof_module a, dd.userprof_moduleinactive a, dd.userprof_content a {
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
}

.cms_widget {
border-radius: 5px;
}

.widget_content {
border-radius: 5px;
}

.cms_widget .block {
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
}

#charnav dd a {
border-radius: 3px;
}

6. Կրկնում ենք նոր CSS սարքելու գործողությունը: Վերնագրում գրում ենք, օրինակ` Shadow, իսկ ներքեւում պատճենում հետեւյալ կոդը ու պահպանում.

.memberaction_body.popupbody {
	box-shadow: 0px 4px 7px #808da4;
}

.newcontent_textcontrol {
	box-shadow: 0 3px 8px #dddddd;
}

.footer {
	box-shadow: -2px 2px 2px #2d3f53;
}

.notices li {
	box-shadow: -2px 2px 2px #808da4;
}

div#content_container
.forumhead {
	box-shadow: -2px 2px 2px #808da4;
}

div#content_container
.forumrow {
	box-shadow: -2px 2px 2px #808da4;
}

#sidebar {
	box-shadow: -2px 2px 2px #808da4;
}

div#forum_info_options.forum_info.block
h4.forumoptiontitle.blockhead {
box-shadow: -2px 0px 2px #808da4;
}

div#forum_info_options.forum_info.block
h4.blockhead {
box-shadow: -2px 0px 2px #808da4;
}

.blockbody.formcontrols.floatcontainer {
box-shadow: -2px 2px 2px #808da4;
}

div#threadlist.threadlist
.threadlisthead.table {
box-shadow: -2px 2px 2px #808da4;
}

div#threadlist.threadlist
.rating0 {
box-shadow: -2px 2px 2px #808da4;
}

.forum_info_block.blockbody.formcontrols {
box-shadow: -2px 2px 2px #808da4;
}


div#wgo.collapse.wgo_block.block h2.blockhead {
box-shadow: -2px 2px 2px #808da4;
}

div#forumbits.forumbits
.forumbit_post {
box-shadow: -2px 2px 2px #808da4;
}

div#thread_info.thread_info.block
h4.threadinfohead.blockhead {
box-shadow: -2px 0px 2px #808da4;
}

div#thread_info.thread_info.block
h4.blockhead {
box-shadow: -2px 0px 2px #808da4;
}

div#thread_info.thread_info.block
.thread_info_block.blockbody.formcontrols {
box-shadow: -2px 2px 2px #808da4;
}

div#blog_sidebar_generic {
box-shadow: -2px 2px 2px #808da4;
}
.cms_widget {
box-shadow: -2px 2px 2px #808DA4;
}
.albumlist_entry {
box-shadow: -2px 2px 2px #808DA4;
}

#latestalbumcontainer li {
box-shadow: -2px 2px 2px #808DA4;
}

#thumbnails li {
box-shadow: -2px 2px 2px #808DA4;
}

#content .blockrow > li, #content .blockrow > ol, #content .blockrow > div {box-shadow: -2px 2px 2px #808DA4;
}

#content .blockhead {box-shadow: -2px 2px 2px #808DA4;
font-weight: bold;
}

#pictures .blockbody .blockrow, #group_discussion_inlinemod_form .blockbody .blockrow {
box-shadow: -2px 2px 2px #808DA4;
}

h2.searchlisthead {
box-shadow: -2px 2px 2px #808DA4;
}

ol#searchbits.searchbits
{
box-shadow: -2px 2px 2px #808DA4;
}

ol#stickies.stickies
.icon0 {
box-shadow: -2px 2px 2px #808da4;
}

div#sidebar_container.profile_widgets.member_summary.userprof_moduleinactive.userprof_moduleinactive_border.sidebarleft
{ box-shadow: -2px 2px 2px #808da4;
}

Այքանից հետո ակումբի էջը վերստին բեռնում ենք (Ctrl+R) եւ` վայելում:


Նկատված թերությունները խնդրում եմ նշեք այս թեմայում:

[Rammstein]

Բայց սպասեք, սա դեռ ամենը չէ , կա նաեւ բոնուս.
Գրառումների ստորին մասերում գտնվող պատկերակները (մեջբերել, պատասխանել, խմբագրել, վարկանիշ, շնորհակալություն եւն) այս պահին լիարժեք չեն երեւում (այս մեկը արդեն բոլոր բրաուզերներով է էդպես)` այլ վերեւից ու ներքեւից կտրված ենք երեւում: Սրա մասին նույնպես հոգացել եմ:

Կատարում ենք նույն` CSS սարքելու գործողությունները, վերագիրը գրում ենք, ասենք` Postbit, իսկ կոդի դաշտում` պատճենում հետեւայլը ու պահպանում.

.postbit .userinfo .postbit_reputation { margin-left: 0px;}
.postbit .postfoot .textcontrols, .postbitlegacy .postfoot .textcontrols, .eventbit .eventfoot .eventcontrols { padding: 3px 0 2px;}
.postbitlegacy .postfoot .textcontrols a.editpost, .postbit .postfoot .textcontrols a.editpost, .eventbit .eventfoot .textcontrols 
a.editevent  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.editpost:hover, .postbit .postfoot .textcontrols a.editpost:hover, .eventbit .eventfoot
.textcontrols a.editevent:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.quickreply, .postbit .postfoot .textcontrols a.quickreply, .postbitlegacy .postfoot .textcontrols
a.forwardpost, .postbit .postfoot .textcontrols a.forwardpost  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.quickreply:hover, .postbit .postfoot .textcontrols a.quickreply:hover, .postbitlegacy .postfoot 
.textcontrols a.forwardpost:hover, .postbit .postfoot .textcontrols a.forwardpost:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.newreply, .postbit .postfoot .textcontrols a.newreply  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.newreply:hover, .postbit .postfoot .textcontrols a.newreply:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.multiquote, .postbit .postfoot .textcontrols a.multiquote  {	padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.promotecms, .postbit .postfoot .textcontrols a.promotecms  {	padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.promotecms:hover, .postbit .postfoot .textcontrols a.promotecms:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.infraction, .postbit .postfoot .textcontrols a.infraction  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.infraction:hover, .postbit .postfoot .textcontrols a.infraction:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.report, .postbit .postfoot .textcontrols a.report  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.report:hover, .postbit .postfoot .textcontrols a.report:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.blog, .postbit .postfoot .textcontrols a.blog  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.blog:hover, .postbit .postfoot .textcontrols a.blog:hover  {	padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.reputation, .postbit .postfoot .textcontrols a.reputation  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.reputation:hover, .postbit .postfoot .textcontrols a.reputation:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.ip, .postbit .postfoot .textcontrols a.ip  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.ip:hover, .postbit .postfoot .textcontrols a.ip:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.redcard, .postbit .postfoot .textcontrols a.redcard  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.redcard:hover, .postbit .postfoot .textcontrols a.redcard:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.yellowcard, .postbit .postfoot .textcontrols a.yellowcard  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.yellowcard:hover, .postbit .postfoot .textcontrols a.yellowcard:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.deleted, .postbit .postfoot .textcontrols a.deleted  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.deleted:hover, .postbit .postfoot .textcontrols a.deleted:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a, .postbit .postfoot .textcontrols a, .eventbit .eventfoot .eventcontrols a { padding-top: 3px;}

Էջը Reload անելու մասին չենք մոռանում:

[BOBO]

ապրես, լավ բանա,
ձեր տեղեկացումների ֆոնը էլի ուղղանկյուն ա

[Rammstein]

ապրես, լավ բանա,
ձեր տեղեկացումների ֆոնը էլի ուղղանկյուն ա

Ձեր տեղեկացումների ֆոնը էնպես ա, ինչպես Ֆայրֆոքսում` նոր տեղեկացում ունենալու դեպքում անկյունները կլոր են, իսկ առանց նոր տեղեկացման մկնիկով hover անելու դեպքում` ուղիղ:

[Ապե Ջան]

Այ օրինակ գրառում կատարելիս, գրառման դաշտը չի լինում մեծացնել Օպերայով, իսկ Քրոմով լինում ա:

[BOBO]

Այ օրինակ գրառում կատարելիս, գրառման դաշտը չի լինում մեծացնել Օպերայով, իսկ Քրոմով լինում ա:

քրոմիցա



https://addons.opera.com/addons/exte...size-textarea/
shift սխմած պահի ու մուկը շարժի քլիք արած, կամել նկարի մեջ ցույց եմ տվել ոնց անես

[Rammstein]

https://addons.opera.com/addons/exte...size-textarea/
shift սխմած պահի ու մուկը շարժի քլիք արած, կամել նկարի մեջ ցույց եմ տվել ոնց անես

Ես էս մեկն եմ օգտագործում` https://addons.opera.com/addons/exte...a-resizer/2.6/
Առանց շիֆթի մեծացնում ա, ուղղակի իրա preferences-ի մեջ բոլոր չրթիկները հանել եմ, բացի textarea element-ից ու text attribute-ից:

[BOBO]

Ես էս մեկն եմ օգտագործում` https://addons.opera.com/addons/exte...tarea-resizer/
Առանց շիֆթի մեծացնում ա, ուղղակի իրա preferences-ի մեջ բոլոր չրթիկները հանել եմ, բացի textarea element-ից ու text attribute-ից:

լավ բազմաֆունկցիոնալ ա
մնացած բաներն էլ ա մեկ մեկ պետք լինում մեծացնել

[Rammstein]

Փաստորեն vBulletin-նել ա սկսել մտածել մյուս բրաուզերնրի մասին (ինձնից բան սովորեցին ): Նոր մտա էստեղ տեսա 4.1.4 Beta 1 վերսիան ա տեղադրած ու առանց ոչ մի բանի կլորությունները երեւում են:

Իմանայի էսքան չէի չարչարվի:

[Rammstein]

Էսօր նկատեցի, որ extension-ը ափդեյթ ա եղել ու լավ չի աշխատում, մասնավորապես Postbit-ի համար նախատեսածս կոդը չի աշխատում ու գրառումների տակի կոճակները հին ձեւով են երեւում: Բացի էդ` URL-ի մեջ հայերեն տառեր լինելու դեպքում extension-ի կոճակը չէր աշխատում: Դրա համար փնտրեցի ու մի հատ ուրիշ նմանատիպ էքսթենշն գտա, որը առանց պրոբլեմի աշխատում ա: Ով ուզում ա, թող հինը ջնջի, էս մեկը տեղադրի (ֆայլը կցում եմ գրառմանս), ակումբի էջը reload անի, սեղմի extension-ի կոճակը ու նույն տվածս կոդերը իրար հետեւից պատճենի էս մի էքսթենշնի մեջ ու Save անի:

[BOBO]

սրանով հնարավորա ֆոնտը փոխել?
body, legend {
font-family: "Sylfaen"
}

սենց գրեցի չեղավ ոնց որ

[Rammstein]

սրանով հնարավորա ֆոնտը փոխել?
body, legend {
font-family: "Sylfaen"
}

սենց գրեցի չեղավ ոնց որ

#vbulletin_html * {
font-family: "Sylfaen";
}

Բայց ես զարմանուն եմ` ո՞նց ա էդ Սիլֆաենով հնարավոր մի բան կարդալ:

Սենց ավելի հեշտ ա կարդացվում, չնայած որ էս ֆոնտը փոքր տառերի համար չի նախատեսված.

#vbulletin_html * {
font-family: "Liebe ist fuer alle da";
}

[Rammstein]

Բայց սպասեք, սա դեռ ամենը չէ , կա նաեւ բոնուս.
Գրառումների ստորին մասերում գտնվող պատկերակները (մեջբերել, պատասխանել, խմբագրել, վարկանիշ, շնորհակալություն եւն) այս պահին լիարժեք չեն երեւում (այս մեկը արդեն բոլոր բրաուզերներով է էդպես)` այլ վերեւից ու ներքեւից կտրված ենք երեւում: Սրա մասին նույնպես հոգացել եմ:

Կատարում ենք նույն` CSS սարքելու գործողությունները, վերագիրը գրում ենք, ասենք` Postbit, իսկ կոդի դաշտում` պատճենում հետեւայլը ու պահպանում.

 •

• 

 Սեղմել՝ ցույց տալու համար

.postbit .userinfo .postbit_reputation { margin-left: 0px;}
.postbit .postfoot .textcontrols, .postbitlegacy .postfoot .textcontrols, .eventbit .eventfoot .eventcontrols { padding: 3px 0 2px;}
.postbitlegacy .postfoot .textcontrols a.editpost, .postbit .postfoot .textcontrols a.editpost, .eventbit .eventfoot .textcontrols 
a.editevent  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.editpost:hover, .postbit .postfoot .textcontrols a.editpost:hover, .eventbit .eventfoot
.textcontrols a.editevent:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.quickreply, .postbit .postfoot .textcontrols a.quickreply, .postbitlegacy .postfoot .textcontrols
a.forwardpost, .postbit .postfoot .textcontrols a.forwardpost  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.quickreply:hover, .postbit .postfoot .textcontrols a.quickreply:hover, .postbitlegacy .postfoot 
.textcontrols a.forwardpost:hover, .postbit .postfoot .textcontrols a.forwardpost:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.newreply, .postbit .postfoot .textcontrols a.newreply  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.newreply:hover, .postbit .postfoot .textcontrols a.newreply:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.multiquote, .postbit .postfoot .textcontrols a.multiquote  {	padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.promotecms, .postbit .postfoot .textcontrols a.promotecms  {	padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.promotecms:hover, .postbit .postfoot .textcontrols a.promotecms:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.infraction, .postbit .postfoot .textcontrols a.infraction  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.infraction:hover, .postbit .postfoot .textcontrols a.infraction:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.report, .postbit .postfoot .textcontrols a.report  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.report:hover, .postbit .postfoot .textcontrols a.report:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.blog, .postbit .postfoot .textcontrols a.blog  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.blog:hover, .postbit .postfoot .textcontrols a.blog:hover  {	padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.reputation, .postbit .postfoot .textcontrols a.reputation  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.reputation:hover, .postbit .postfoot .textcontrols a.reputation:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.ip, .postbit .postfoot .textcontrols a.ip  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.ip:hover, .postbit .postfoot .textcontrols a.ip:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.redcard, .postbit .postfoot .textcontrols a.redcard  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.redcard:hover, .postbit .postfoot .textcontrols a.redcard:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.yellowcard, .postbit .postfoot .textcontrols a.yellowcard  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.yellowcard:hover, .postbit .postfoot .textcontrols a.yellowcard:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.deleted, .postbit .postfoot .textcontrols a.deleted  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a.deleted:hover, .postbit .postfoot .textcontrols a.deleted:hover  { padding: 2px;
	padding-left: 20px;}
.postbitlegacy .postfoot .textcontrols a, .postbit .postfoot .textcontrols a, .eventbit .eventfoot .eventcontrols a { padding-top: 3px;}

Էջը Reload անելու մասին չենք մոռանում:

Էս կոդը վաղուց չէի օգտագործում, քանի որ համապատասխան extension չէի գտնում (էն մեկը դադարել էր նորմալ աշխատել Օպերայի նոր վերսիաների հետ): Քիչ առաջ մի հատ extension գտա, նույն կոդը փեյսթ արեցի մեջը, ու wow!

 •

• 

 Սեղմել՝ ցույց տալու համար

Հետո սկսեցի մի քիչ էլ բզբզել, ու WOW!

 •

• 

 Սեղմել՝ ցույց տալու համար

Ակումբի նորեկներին ասեմ, որ ակումբի օրիգինալ գույները ոչ թե հիմիկվանն են, այլ էս տակի նկարի գույները:

Ո՞նց անել. նախ տեղադրում ենք Extension-ը: Բացում ենք նրա preferences-ը, սեղմում ենք New, հետո ստեղծված սթայլը Edit ենք անում: Վերեւի ձախ մասում անուն ենք գրում, օրինակ` «Ակումբ», ներքեւի ձախ անկյունում 3 անգամ սեղմում ենք New: 1-ինում պատճենում ենք մեջբերման սպոյլերի մեջի տեքստը, երկրորդում պատճենում ենք կցված ֆայլի միջի տեքստը, իսկ երրորդում` հետեւյալ տեքստը.

.forumhead { 
background: url("http://www.akumb.am/images/gradients/bg1.png") repeat-x #7192A8;
border: 1px solid #5A7F97;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
clear: both;
color: #FFFFFF;
float: left;
font: 700 12px "Arial", "Tahoma", "Calibri", "Verdana", "Geneva", sans-serif;
margin-top: 8px;
padding: 0px;
width: 100%;
}

h2 span.forumthreadpost { 
text-align: left;
width: 12%;
}

h2.searchlisthead { 
background: url("http://www.akumb.am/images/buttons/newbtn_middle.png") repeat-x #23426D;
font: 700 12px "Tahoma", "Calibri", "Verdana", "Geneva", sans-serif;
}

Էս ձեւը պիտի որ աշխատի նաեւ այլ բրաուզերների վրա, եթե ճարվի սթայլերը փոխող extension:

[Rammstein]

Ֆայլը ափդեյթ եմ արել, քաշեք այստեղից: Շտկել եմ որոշ ստվերների ու եզրագծերի հետ կապված թերություններ:
Ֆայլը պետք է քաշել, բացել, էն երկար կոդը փոխարինել սրանով, իսկ էն վերջին սպոյլերում գրած կարճ կոդը, որը առանձին կետով էինք գրել extension-ի մեջ, կարելի ա ընդհանարպես ջնջել: Այսիքն` կմնա «.postbit»-ով սկսվող կոդը, մեկ էլ էս նոր ափդեյթ արած կոդը:


Ի դեպ, նույն extension-ը կա նաեւ քրոմի համար` https://chrome.google.com/webstore/d...fgmeleoegfcffe
Բայց էն գրառման տակի կոճակներն ուղղող (.postbit-ով սկսվող) կոդը քրոմի տարբերակում կարելի ա չդնել, քանի որ նորմալ չի աշխատում:

Քրոմում ինստալ անելուց հետո վերեւի աջ մասում կհայտնվի իրա կոճակը: Աջ կլիկ ենք անում դրա վրա ու` Options: Սեղմում ենք Write new style: Name-ը գրում ենք, օրինակ` Ակումբ, կոդի դաշտում պատճենում ենք մի քիչ վերեւում մեծ տառերով գրված հղման պարունակությունը: Ներքեւում սեղմում ենք Specify, ձախ կողմում նշում ենք «URLs on the domain», աջ կողմում գրում ենք www.akumb.am ու ձախ մասում սեղմում ենք Save: Վերջ:


Հ.Գ. Նախորդ գրառման կցորդը ջնջում եմ:

[Rammstein]

Հիմա առաջարկեմ շատ ավելի լավ տարբերակ:
Քաշում ենք էս ֆայլը, հանում ենք zip-ից ու գցում մի ապահով տեղ: Opera-ով բացում ենք akumb.am-ը, աջ կլիկ ենք անում էջի որեւէ դատարկ մասում ու սեղմում «Edit Site Preferences...»: Display թաբում կա My style sheet: Սեղմում ենք Choose, ընտրում ապահով տեղում գտնվող akumb.css ֆայլը ու սեղմում OK: Reload ենք անում ակումբը ու վայելում ակումբի իրական գույները:





Էլ ոչ մի կիսատ պռատ աշխատող extension, էլ ոչ մի ավելորդ կոդ css-ի մեջ ու էլ ոչ մի զադնի:
Ի տարբերություն նախորդ առաջարկածս CSS-ների, էս CSS-ի մեջից ջնջել եմ ավելորդ կոդերը, թողել եմ միայն նրանք, որոնք պարտադիր կիրառման դեպքում ոչ մի բանի չեն խանգար: Բացի այդ` նախորդից հետո էլի լիքը բաներ եմ շտկել:

Եթե թերություն նկատեք, ասեք, կփորձեմ ուղղել:

Միանգամից ասեմ, որ մի քանի թերություն նկատել եմ, բայց դեռ չեմ կարողացել նենց ուղղել, որ ուրիշ բան դրանից չտուժի: Առանց համապատասխան գիտելիքների էլ` միայն ինտուիցիայով ու բզբզելով դժվար ա: Թերություններից մեկը, կներեք արտահայտությանս համար, անդամի ոճերն են (user styles) : Չգիտեմ ոնց անեմ, որ իրար չխառնվեն ակումբի ու անձնագրերի սթայլերը: Դրա համար սա օգտագործելուց դեպքում կարելի ա անդամի ոճերն անջատել:





Քրոմով էլ փորձեցի, էն էքսթենշնով էս կոդը աշխատում ա ու բնականաբար շատ ավելի լավ ա, քան նախորդ կոդը: