Tło w CKEditor

[Pandrov]

Witam

Jak mozna zmienic tlo w CKEditor w IPB 3.4.5.

To jest taki hard coded css z tym ckeditor, ze nie moge tego odnalezc i zmienic

 

a moze ktos ma juz ipb_ckediotrs.css z fajnie zrobionym edytorem, aby byl ciemniejszy (nie bialy)

 

Ja mam tak

 

 

    /***************************************************************/
    /* IP.Board 3.2 Editor CSS                                       */
    /* ___________________________________________________________ */
    /* By Matt Mecham                                                                   */
    /***************************************************************/
    /* Styles for the editor (colors in main css) */
    /***************************************************************/
     
    .bbcode_hilight {
            background-color: yellow;
    }
     
    .as_content {
            background: #2C2C2C;
            font-size: 1.0em;
            border: 1px solid black;
            padding: 6px;
            margin: 8px;
            overflow: auto;
            max-height: 400px;
    }
    .as_buttons {
            text-align: right;
            padding: 4px 0px;
    }
    .as_message {
            display: inline-block;
    }
     
    .ipsEditor_textarea {
            width: 99%;
            height: 200px;
            font-size: 14px;
    }
    .cke_browser_webkit {outline:none !important;}
           
    /* Main tool bar BG */
    .cke_top {
            background: #393939 url({style_images_url}/editor/toolbar_bg.png) repeat-x !important;
    }
     
    /* Normal STD */
    .cke_skin_ips textarea.cke_source {
            /* removed as causes pasted text to appear on one line: white-space: pre-line !important;*/
    }
     
    /* Minimized RTE */
    .cke_skin_ips .cke_wrapper.minimized {
            opacity: 0.6 !important;
            background: none !important;
            border: none !important;
    }
     
    /* Minimized STD */
    .cke_skin_ips .cke_wrapper.minimized.std {
            border: 2px solid #535353 !important;
    }
     
    /* Main Editor wrapper */
    .cke_skin_ips { margin-bottom: 0px !important; }
     
    .cke_skin_ips .cke_wrapper
    {
            padding: 0px 5px 0px 3px !important;
            border: 2px solid #535353 !important;
            background-color: #393939 !important;
            background-image: none !important;
    }
     
    /* OFF state for editor buttons */
    .cke_skin_ips .cke_toolgroup
    {
            background-color: transparent !important;
    }
     
    /* HOVER 'off' button */
    .cke_skin_ips .cke_button a:hover,
    .cke_skin_ips .cke_button a:focus,
    .cke_skin_ips .cke_button a:active      /* IE */
    {
            background-color: #535353 !important;
    }
     
    /* HOVER 'on' button */
    .cke_skin_ips .cke_button a:hover.cke_on,
    .cke_skin_ips .cke_button a:focus.cke_on,
    .cke_skin_ips .cke_button a:active.cke_on       /* IE */
    {
            background-color: #747474 !important;
    }
     
    /* Button group */
    .cke_skin_ips .cke_toolgroup
    {
            margin-right: 0px !important;
    }
     
    /* Button separator */
    .cke_skin_ips .cke_separator
    {
            border-left:solid 1px #535353;
            display:inline-block !important;
            float:left;
            height:30px;
            margin:0px 2px;
    }
     
    /* DIALOG: Modal blind */
    .cke_dialog_background_cover
    {
            background-color: #3e3e3e !important;
    }
     
    /* DIALOG: Title - based on .maintitle */
    .cke_skin_ips .cke_dialog_title
    {
            background: #232323 url({style_images_url}/maintitle.png) repeat-x top !important;
            color: #fff !important;
            padding: 10px 10px 11px !important;
            font-size: 16px !important;
            font-weight: 300 !important;
            text-shadow: 0 1px 2px rgba(0,0,0,0.3);
            font-weight: normal;
    }
     
    /* Dialog: Body */
    .cke_skin_ips .cke_dialog_body {
            z-index: 20000 !important;
    }
     
    /* Dialog tab bg (will usually match dialog title) */
    .cke_skin_ips .cke_dialog_tabs {
            background: #232323 !important;
    }
     
    /* Dialog Title close button */
    .cke_skin_ips .cke_dialog_close_button
    {
            background: transparent url({style_images_url}/close_popup.png) no-repeat top left !important;
            width: 13px !important;
            height: 13px !important;
            top: 11px !important;
            right: 10px !important;
    }
     
    /* Dialog OK / Cancel buttons - based on ipsButton_secondary*/
    .cke_skin_ips span.cke_dialog_ui_button
    {
            height: 22px !important;
            line-height: 22px !important;
            font-size: 12px !important;
            color: #7c7c7c !important;
            padding: 0 10px !important;
            background: #A9A9A9 !important;
            background: -moz-linear-gradient(top, #A9A9A9 0%, #e5e5e5 100%) !important; /* firefox */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#A9A9A9), color-stop(100%,#e5e5e5)) !important; /* webkit */
            border: 1px solid #dbdbdb !important;
            -moz-box-shadow: 0px 1px 0px rgba(255,255,255,1) inset, 0px 1px 0px rgba(0,0,0,0.3) !important;
            -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,1) inset, 0px 1px 0px rgba(0,0,0,0.3) !important;
            box-shadow: 0px 1px 0px rgba(255,255,255,1) inset, 0px 1px 0px rgba(0,0,0,0.3) !important;
            -moz-border-radius: 3px !important;
            -webkit-border-radius: 3px !important;
            border-radius: 3px !important;
            color: #616161 !important;
            display: inline-block !important;
            white-space: nowrap !important;
    }
     
    /* Turn off resizer */
    .cke_skin_ips .cke_dialog_footer .cke_resizer { display: none; }
     
    /* Emo slide out tray */
    .ipsSmileyTray
    {
            position: relative;
           
            text-align: center;
            overflow: auto;
            margin: 0px auto 0px auto;
            padding: 4px 24px 4px 24px;
            min-width: 600px;
            width: 75%;
            height: 32px;
            border: 1px solid #535353;
            -moz-border-radius: 3px;
            -webkit-border-radius: 3px;
            border-radius: 3px;
           
            -moz-border-radius-topleft: 0px;
            -webkit-border-radius-topleft: 0px;
            border-top-left-radius: 0px;
           
            -moz-border-radius-topright: 0px;
            -webkit-border-radius-topright: 0px;
            border-top-right-radius: 0px;
           
            border-top: 0px;
            -moz-box-shadow: inset 0 1px 0 0 #eff3f8, 0px 2px 3px rgba(0,0,0,0.2);
            -webkit-box-shadow: inset 0 1px 0 0 #eff3f8, 0px 2px 3px rgba(0,0,0,0.2);
            box-shadow: inset 0 1px 0 0 #eff3f8, 0px 2px 3px rgba(0,0,0,0.2);
           
            background: #393939;
            overflow-y: hidden;
    }
            .ipsSmileyTray img.bbc_emoticon {
                    opacity: 0.8;
                    cursor: pointer;
                    margin: 6px 3px 0px 3px;
                    max-width: 30px;
                    max-height: 30px;
             }
                    .ipsSmileyTray img.bbc_emoticon:hover {
                            opacity: 1.0;
                    }
           
            .ipsSmileyTray .ipsSmileyTray_next {
                    background: transparent url({style_images_url}/editor/next.png) no-repeat;
                    background-position: 0px 10px;
                    display: inline-block;
                    /*float: right;
                    position: relative;
                    right: -20px;*/
                    position: absolute;
                    right: 5px;
                    top: 4px;
                    width: 13px;
                    height: 30px;
                    cursor: pointer;
            }
           
            .ipsSmileyTray .ipsSmileyTray_prev {
                    background: transparent url({style_images_url}/editor/prev.png) no-repeat;
                    background-position: 0px 10px;
                    display: inline-block;
                    /*position: relative;
                    left: -20px;
                    float: left;*/
                    position: absolute;
                    left: 5px;
                    top: 4px;
                    width: 13px;
                    height: 30px;
                    cursor: pointer;
            }
           
            .ipsSmileyTray_all {
                    display: block;
                    width: auto;
                    margin: 3px auto 0px auto;
                    text-align: center;
                    cursor: pointer;
                    font-size: 10px !important;
            }
     
    /* Dialogs */
    .cke_dialog.cke_single_page td.cke_dialog_contents {
            height: auto !important;
    }
     
    .cke_dialog .cke_dialog_ui_textarea { height: 130% !important }
           
    /* ACP Specific */
    table.cke_editor td { padding: 0px !important; }
 

 

 

Co odpowiada za tło i kolor tekstu?

[DawPi]

Użyj trochę mózgownicy i poświęć temu chwilkę, tutaj masz super poradnik: http://forum.invisionize.pl/tutorials/article/17-jak-znalezc-i-zmienic-fragment-stylu/

[DawPi]

Automatyczna wiadomość

Temat przeniesiony z forum

Invision Power Board → Invision Power Board 3.4 → Ogólny support IPB

do

Invision Power Board → Invision Power Board 3.4 → Style - pomoc

[BitGit]

 

Co odpowiada za tło i kolor tekstu?

 

To co tutaj wkleiłeś odpowiada za kolor i wygląd (całość)

 

Fragment kodu tu wcale nie pomoże. Żeby przerobić ckeditor trzeba nie tylko pozmieniać wartości w stylu, ale także dodać/podmienić obrazki, bo dla jasnego stylu czarna ikona rte jet ok, ale jeśli będzie miał ciemny toolbar to już nie będą wcale owe ikonki widoczne... Generalnie jest troszkę zabawy z podmianą i dopasowaniem stylów.

[Pandrov]

A co tu odpowiada za tło?

 

To to wiem, ze ikonki tez.

 

DawPi akurat tla sie nie da "namierzyc" takim sposobem co podales w linku, gdybym mogl to bym tu nie pisal (gdybym zmienil sobie ten kolor)

[JamLasica]

Wszystko da się w ten sposób namierzyć - to, że nie potrafisz to inna sprawa

Dałbyś konkretny URL i konkretnie co chcesz zmieć to można by ewentualnie pomyśleć.

http://community.invisionpower.com/files/file/4679-dustblue-codegamenet/

Tutaj masz ciemne wszystko, "wykorzystaj" to co potrzebujesz.

Edytowane 4 Października 2013 przez JamLasica

[Pandrov]

Chce poprostu zmienic tlo edytora, mam ceimny layout, a edytor jasny tak jak tu na forum, wali po oczach.