Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Ext JS Premium Member
    Join Date
    Jun 2011
    Posts
    253
    Vote Rating
    7
    ontho is on a distinguished road

      3  

    Default Unanswered: Scoped themes in ExtJS 4.2?

    Unanswered: Scoped themes in ExtJS 4.2?


    Hello!

    I want to upgrade from ExtJS 4.1.3 to 4.2., but I need a scoped grey theme. I used this guide to COMPILE such a theme before 4.2.: http://www.sencha.com/learn/theming/
    But this doesn't seem to work anymore, I get errors like "You must compile individual stylesheets from the project directory."

    For 4.2., I found: http://docs.sencha.com/extjs/4.2.0/#!/guide/theming
    But there is nothing in it about scoped themes at all. And I couldn't find any scoped themes in 4.2. anyway - are they gone for some reason? Any "How-Tos" on making scoped themes in 4.2?

  2. #2
    Sencha User mashiki's Avatar
    Join Date
    Oct 2007
    Location
    Japan
    Posts
    139
    Vote Rating
    0
    mashiki is on a distinguished road

      0  

    Default


    I want to use 4.2's ext-scoped-all.css OR to know how to make it with sencha SDK.

    Pleeeeese tel us how to do these!

  3. #3
    Ext JS Premium Member
    Join Date
    Jun 2011
    Posts
    253
    Vote Rating
    7
    ontho is on a distinguished road

      0  

    Default


    I managed to do it, but - depending on what other CSSs are included into the html-document - you might need to repeat this for every single css-id you want to address which can make css-file quite large:

    The steps are:
    1. Create an scss-file like:
    Code:
    #parent-element {
    @import "ext-theme-gray-all.scss"
    }
    2. COMPILE the file (see links in my first post).

    3. Insert a reset-css to the front of the generated css-file, like:
    Code:
    #parent-element div, 
    #parent-element span, 
    #parent-element applet, 
    #parent-element object, 
    #parent-element iframe,
    #parent-element h1, 
    #parent-element h2, 
    #parent-element h3, 
    #parent-element h4, 
    #parent-element h5, 
    #parent-element h6, 
    #parent-element p, 
    #parent-element blockquote, 
    #parent-element pre,
    #parent-element a, 
    #parent-element abbr, 
    #parent-element acronym, 
    #parent-element address, 
    #parent-element big, 
    #parent-element cite, 
    #parent-element code,
    #parent-element del, 
    #parent-element dfn, 
    #parent-element em, 
    #parent-element font, 
    #parent-element img, 
    #parent-element ins, 
    #parent-element kbd, 
    #parent-element q, 
    #parent-element s, 
    #parent-element samp,
    #parent-element small, 
    #parent-element strike, 
    #parent-element strong, 
    #parent-element sub, 
    #parent-element sup, 
    #parent-element tt, 
    #parent-element var,
    #parent-element b, 
    #parent-element u, 
    #parent-element i, 
    #parent-element center,
    #parent-element dl, 
    #parent-element dt, 
    #parent-element dd, 
    #parent-element ol, 
    #parent-element ul, 
    #parent-element li,
    #parent-element fieldset, 
    #parent-element form,
    #parent-element label,
    #parent-element legend,
    #parent-element table,
    #parent-element caption, 
    #parent-element tbody,
    #parent-element tfoot, 
    #parent-element thead, 
    #parent-element tr,
    #parent-element th,
    #parent-element td,
    #parent-element table tr,
    #parent-element table th,
    #parent-element table td,
    #parent-element input,
    #parent-element select,
    #parent-element textarea
    {
        background:none;
        border:none;
        border-collapse:separate;
        border-spacing:0;
        bottom:auto;
        clear:none;
        color:#000000;
        cursor:default;
        display:auto;
        empty-cells:show;
        float:none;
        font-family:Arial, Helvetica, sans-serif;
        font-size:auto;
        font-style:normal;
        font-weight:normal;
        height:auto;
        left:auto;
        letter-spacing:normal;
        line-height:normal;
        margin: 0;
        max-height:none;
        max-width:none;
        min-height:0;
        min-width:0;
        overflow:visible;
        padding: 0;
        position:static;
        right:auto;
        table-layout:auto;
        text-align:left;
        text-decoration:none;
        text-indent:0;
        text-transform:none;
        top:auto;
        visibility:visible;
        white-space:normal;
        /*width:auto; Some strange things in FF?!*/
        z-index:auto;
    }
    4. Use the created css-file instead of the ExtJs-css-file and put everything concering ExtJs into a div like <div id="parent-element">... ExtJs-Components render here... </div>.



    Another approach is to use a .x-reset definition. Like:

    1. Take the original CSS.

    2. Do these replacements:
    PHP Code:
        $sCss str_replace("img{border:0}"".x-reset img{border:0}"$sCss);
        
    $sCss str_replace(".x-border-box *"".x-reset *"$sCss); 
    3. Add to your javascript code:
    Code:
    Ext.override(Ext.AbstractComponent,
    {    componentCls: 'x-reset'
    });
    But keep in mind that every #-id-selector appearing in other CSS included into the html-document might overwrite anything you defined as .x-reset.

    Warning: This is all not documented or featured by ExtJs, so I have no idea if this will work in your case, in every browser or even after the next update.

  4. #4
    Sencha User mashiki's Avatar
    Join Date
    Oct 2007
    Location
    Japan
    Posts
    139
    Vote Rating
    0
    mashiki is on a distinguished road

      0  

    Default


    Thank you.

    I tried your 2nd advice and got a respected result.

    Our project can now use 4.2.1.

    And next time I try to your 1st advice, because I want to use minimized css too to get more speed.

  5. #5
    Sencha User
    Join Date
    May 2013
    Posts
    2
    Vote Rating
    0
    Meixger is on a distinguished road

      0  

    Default


    from Introducing Ext JS 4.2 http://www.sencha.com/blog/introducing-ext-js-4-2/

    "[..] These changes ranged from removing the CSS reset (its numerous “expensive” rules to reset, scope reset and unreset),[..]"

  6. #6
    Sencha User mashiki's Avatar
    Join Date
    Oct 2007
    Location
    Japan
    Posts
    139
    Vote Rating
    0
    mashiki is on a distinguished road

      0  

    Default


    Do I hear that "scoped" has already become unnecessary in 4.2?

  7. #7
    Sencha User
    Join Date
    May 2013
    Posts
    2
    Vote Rating
    0
    Meixger is on a distinguished road

      0  

    Default


    Quote Originally Posted by mashiki View Post
    Do I hear that "scoped" has already become unnecessary in 4.2?
    I don't think so – without "scoped" themes Twitter BootStrap will confligt with ExtJS

Thread Participants: 2