[CLOSED] How to change default font family

  1. #1

    [CLOSED] How to change default font family

    I have create a .css file and load this file in every form in my web site.

    .label-view .x-panel-body .x-form-display-field .x-form-field .x-body
    {
        background: white;
        font: 12px "Helvetica Neue",Arial, Helvetica, sans-serif;
    }
    
    body, div, form, img, ul, ol, li, dl, dt, dd, table, td, tr, th
    {
        font: normal 12px "Helvetica Neue",tahoma,arial,helvetica,sans-serif;
    }
    However, it seems that the labelfield of most control, like textfield, combobox, datefield etc. have not change.

    How can I get it works for all control?
    Last edited by Daniil; Feb 25, 2014 at 5:44 AM. Reason: [CLOSED]
  2. #2
    Hello,

    Maybe try adding !important at the end of each css line that is not overwriting properly.
    Geoffrey McGill
    Founder & CEO
  3. #3
    I have tried this, but not work.

    .label-view .x-panel-body .x-form-display-field .x-form-field .x-body
    {
        background: white !important;
        font: 12px "Helvetica Neue",Arial, Helvetica, sans-serif !important;
    }
     
    body, div, form, img, ul, ol, li, dl, dt, dd, table, td, tr, th
    {
        font: normal 12px "Helvetica Neue",tahoma,arial,helvetica,sans-serif !important;
    }
  4. #4
    You might need to override more specific options like "font-size" and "font-family".

    You can use this technique
    CSS Change TabPanel Header Color - Ext.NET on Vimeo
    to investigate why your rules are not applied.
  5. #5
    I have try to set the .cls property when from load and it works.

    However, when I do same thing on button

    This is my .css file
            .testInner .x-btn-default-small .x-btn-inner
            {
                font-size: 20px;
                color: #0066cc;
            }
    Set CtCls in FormLoad
           MyButton.CtCls = "testInner";
    It works for normal button, but not works for button in the toolbar.

    <ext:Panel ID="pnlMain" runat="server">
                <TopBar>
                    <ext:Toolbar ID="Toolbar1" runat="server"><%-- StyleSpec="position: fixed;  top: 0;  left: 0;  width: 100%;"  Floating="true"--%>
                        <Items>
                            <ext:Button ID="cmdNew" runat="server" Text="Load" Icon="New" CtCls="testInner">
                            </ext:Button>
                            <ext:ToolbarSeparator />
                            <ext:Button ID="cmdDelete" runat="server" Text="Load" Icon="Delete">
                            </ext:Button>
                            <ext:ToolbarSeparator />
                        </Items>
                    </ext:Toolbar>
                </TopBar>
    ...
    How can I fix this?
  6. #6
    What about to use a Button's Cls?

    Example
    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <!DOCTYPE html>
    <html>
    <head runat="server">
        <title>Ext.NET v2 Example</title>
    
        <style>
            .my-button .x-btn-inner {
                font-size: 20px;
                color: #0066cc;
            }
        </style>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
    
            <ext:Panel runat="server">
                <TopBar>
                    <ext:Toolbar runat="server">
                        <Items>
                            <ext:Button runat="server" Text="Load" Cls="my-button" />
                        </Items>
                    </ext:Toolbar>
                </TopBar>
            </ext:Panel>
    
            <ext:Panel runat="server">
                <Items>
                    <ext:Button runat="server" Text="Load" Cls="my-button" />
                </Items>
            </ext:Panel>
        </form>
    </body>
    </html>
  7. #7
    It's work! Thank you!

Similar Threads

  1. Replies: 4
    Last Post: Jul 25, 2013, 9:51 AM
  2. [CLOSED] Font Family Extjs 4...
    By luiz in forum 2.x Premium Help
    Replies: 2
    Last Post: Jun 24, 2013, 1:33 PM
  3. Replies: 2
    Last Post: Oct 03, 2011, 4:52 AM
  4. Replies: 1
    Last Post: Aug 06, 2011, 3:53 PM
  5. How to change default font of HTML Editor
    By VietView in forum 1.x Help
    Replies: 0
    Last Post: Mar 25, 2009, 9:22 AM

Posting Permissions