Changing existing themes.

2 posts, 0 answers
  1. dsterk
    dsterk avatar
    2 posts
    Member since:
    Sep 2011

    Posted 02 Aug 2013 Link to this post

    Hello,

    I'm attempting to make a small change to the file: kendo.dataviz.black.min.css

    The section changed in kendo.dataviz.black.min.css is the following:
    .k-chart .k-mask
    {
        /*orginal background-color*/
        /*background-color: #3d3d3d;*/
        background-color: #171717;   
        filter: alpha(opacity=70);
        -moz-opacity: .70;
        opacity: .70;
    }

    The references to the files are the following:
        @*Kendo CSS*@
        <link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.common.min.css")" rel="stylesheet" type="text/css" />
        <link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
        <link href="@Url.Content("~/Content/kendo/2013.2.716/kendo.dataviz.black.min.css")" rel="stylesheet" type="text/css" />

        @*Kendo Scripts*@
        <script src='@Url.Content("~/Content/js/jquery-1.10.1.min.js")'></script>
        <script src="@Url.Content("~/Scripts/kendo/2013.2.716/jquery.min.js")"></script>
        <script src="@Url.Content("~/Scripts/kendo/2013.2.716/kendo.all.min.js")"></script>
        <script src="@Url.Content("~/Scripts/kendo/2013.2.716/kendo.aspnetmvc.min.js")"></script>
        <script src="@Url.Content("~/Scripts/typescript/app.js")"></script>
        <script src="@Url.Content("~/Scripts/kendo.modernizr.custom.js")"></script>

    The code for my chart is the following:
                     @(Html.Kendo().Chart()
                        .Name("chart")
                        .Title("% Long vs S&P 500")
                        .Theme("black")
                        ...

    The chart renders perfect except it renders with default background color for the black theme #3d3d3d, instead of my altered #171717.

    Why isn't this working?

    Thank you.
  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 05 Aug 2013 Link to this post

    Hi Gary,

    I already replied to the same question in your other thread, however I am pasting my reply here too:

    Generally speaking you could make changes in the CSS files, however the change you mentioned (changing background color of .k-chart .k-mask) is not visible because .k-mask is used in Kendo UI StockChart (while in the provided configuration you use Kendo UI Chart). In order to assist you best and provide concrete recommendations I would like to ask you to provide more detailed information about the exact component from the Chart you would like to change. Thank you in advance for your cooperation.
     

    Regards,
    Iliana Nikolova
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top