Unplanned
Last Updated: 19 Oct 2021 12:03 by ADMIN

In version 2.27 of Telerik UI for Blazor the following problematic behavior is observed with long labels in the Grid PopUp edit form:

  • If no space is included, they are cut from the form
  • If space is included, they are wrapped and not cut but are not matching the alignment of the other labels

Unplanned
Last Updated: 12 Mar 2021 19:52 by ADMIN
Created by: Marc Simkin
Comments: 0
Category: Themes
Type: Bug Report
3

If I place the DateRangePicker inside a TelerikForm, the start and end input fields are stacked vertically.

If I were to place the control just inside a div, they are arranged horizontally.

How can I get the control to arrange itself horizontally when inside a form?

---

ADMIN EDIT

Here is a reproducible that begins with a short CSS workaround (remove the style to see the issue):

<style>
    .k-form .k-daterangepicker-wrap .k-floating-label-container {
        display: inline-block;
        width: auto;
    }
</style>



<div class="demo-section k-form k-form-vertical">
    <div class="k-form-field">
        <label for="outbound-date" class="k-label k-form-label">Travel Date</label>
        <div class="k-form-field-wrap">
            <TelerikDateRangePicker @bind-StartValue="@StartValue"
                                    @bind-EndValue="@EndValue"
                                    StartId="outbound-date">
            </TelerikDateRangePicker>
        </div>
    </div>
    <div class="k-form-field">
        <p>The selected travel date is: <strong>@StartValue.Value.ToLongDateString()</strong> and <strong>@EndValue.Value.ToLongDateString()</strong></p>
    </div>
</div>

<div class="demo-section">
    <h4><label for="outbound-date">Book your flight tickets</label></h4>

    <TelerikDateRangePicker @bind-StartValue="@StartValue"
                            @bind-EndValue="@EndValue"
                            StartId="outbound-date">
    </TelerikDateRangePicker>

    <div class="mt-lg">
        <h6 class="kd-demo-heading mt-sm">Selected Dates</h6>
        <div><strong>Departure: </strong> @StartValue?.ToString("dd MMM yyyy")</div>
        <div><strong>Return: </strong> @EndValue?.ToString("dd MMM yyyy")</div>
    </div>
</div>

@code {
    public DateTime? StartValue { get; set; } = new DateTime(2020, 4, 3);
    public DateTime? EndValue { get; set; } = new DateTime(2020, 4, 10);
}

---

Unplanned
Last Updated: 10 Mar 2021 08:11 by ADMIN
Created by: Greg
Comments: 0
Category: Themes
Type: Bug Report
1

Ellipsis missing on month view

---

ADMIN EDIT

The Ellipsis icon is invisible in Material and Default, partially hidden in Bootstrap. The Show More button is invisible in Material. You can see the issues in the following demo: https://demos.telerik.com/blazor-ui/scheduler/month-view

Here is a workaround to make the Ellipsis icon visible which indicates a button in Material too:

 

<style>
    button.k-more-events > .k-icon.k-i-more-horizontal {
        top: initial;
        bottom: 0;
        transform: translate(-50%);
    }
</style>

 

 

Unplanned
Last Updated: 16 Dec 2020 14:16 by Naveen

Bug report

On screens with smaller sizes not all tools in the Spreadsheet Toolbar are visible. The tools overlap the overflow button and thus cannot be selected.

Reproduction of the problem

  1. Run the following demo and reduce the window width

Current behavior

On wider screens all tools are visible:
image
On narrower screens only some tools are visible and the overflow button is overlapped:
image
or completely hidden:
image

Expected/desired behavior

The overflow button should be visible so all Spreadsheet tools are accessible.

Environment

  • Kendo UI version: 2020.3.118
  • Browser: [all]
Unplanned
Last Updated: 04 Dec 2020 12:45 by ADMIN
Created by: Pandiarajan
Comments: 0
Category: Themes
Type: Bug Report
0
kendoui.for.jquery.2020.3.1021.commercial-source\src\styles\mobile\common\modalview.less
Line 56:     box-flex: 1;

kendoui.for.jquery.2020.3.1021.commercial-source\src\styles\mobile\common\buttongroup.less
Line 31:     margin-collapse: separate;

kendoui.for.jquery.2020.3.1021.commercial-source\src\styles\mobile\common\scroller.less
Line 103:     margin-collapse: separate;

kendoui.for.jquery.2020.3.1021.commercial-source\src\styles\web\common\mixins.less
Line 54: 

.flex-align(@alignment) {
    flex-align: @alignment; 
}

Unplanned
Last Updated: 13 Nov 2020 14:36 by ADMIN

I need my application to be fully WCAG compliant.

I have multiple form fields that are not to be modified by the user, but must be readable by them.

Take the combobox for example: https://dojo.telerik.com/@GaloisGirl/exAZIROW

  • The disabled variant is not focusable, nor does it have sufficient contrast between text and background. This is correct by WCAG rules, but not suitable to my use case.
  • The readonly variant is almost perfect, but the arrow has visual cues that suggest it's interactive (color, hover background, cursor) when it's not.

The same problems occurs for DatePicker (see https://docs.telerik.com/kendo-ui/api/javascript/ui/datepicker/methods/readonly ) and other widgets.

Please keep in mind the subtle differences in meaning between readonly and disabled and do not just apply disabled styles to readonly widgets.

Unplanned
Last Updated: 16 Oct 2020 07:06 by ADMIN
Scheduled for 2020.R3.SP.next

Describe the bug
The TextArea has 14 px font-size and the other inputs have 100% font-size.

Reported in: 1486377

To reproduce
https://dojo.telerik.com/iLeZIpEz

  1. Use the LESS-based theme.
  2. Implement a TextArea component.
  3. Implement a TextBox component.

Expected behavior
The font-sizes for the TextArea and the TextBox have to be equal.

Environment

  • Kendo UI version: 2020.3.915
  • Browser: [all]
Unplanned
Last Updated: 01 Sep 2020 14:06 by Alex
Created by: Alex
Comments: 0
Category: ThemeBuilder
Type: Bug Report
1

On creating a custom theme based on the Default v2 theme (its possibly the same with the other SASS themes), if you uncheck a component (e.g., the Editor) in the list so that the modifications do not apply to it, the ResponsivePanel does not work as expected with the created custom theme. On narrow browser window width, the sandwich button appears, but the Menu wrapped by the ResponsivePanel does not hide.

To reproduce:

  1. Go to the SASS Theme builder.
  2. Select Default theme.
  3. Uncheck the Editor from the list.
  4. Change a random variable and download the theme.
  5. Load the custom theme in a new Telerik UI for ASP.NET Core application created with our VS template. The template has a ResponsivePanel set up by default in the _Layout.
  6. Run the project and resize the browser window so that the sandwich button appears.

Expected: the Menu wrapped by the ResponsivePanel hides.

Actual: The Menu remains visible.

Unplanned
Last Updated: 17 Jul 2020 13:49 by loi

Bug report

Reproduction of the problem

  1. Go to the Themebuilder page
  2. Select BlueOpal theme
  3. Modify the "Error" color.
  4. Download the custom theme

Current behavior

The generated kendo.custom.css file contains the following rule:

undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined .k-text-error {
  color: #7030a0;
}

Expected/desired behavior

The rule should have correct selector, or if it is redundant it should not be included in the file.

Environment

  • Kendo UI version: 2020.2.617
  • jQuery version: x.y
  • Browser: [all]
Unplanned
Last Updated: 28 May 2020 12:34 by ADMIN

Hello,

I prepared a demo https://dojo.telerik.com/EYeYUSUw/6

Also applies to the latest default sass theme but probably to many more.

As you can see, the master grid its 'content row' hover effect is being applied to even the header of the detail grid and there is no way to resolve that unwanted effect apart from adding more styling tedious rules. 

The resolution is so simple:

.k-grid tbody tr:hover, .k-grid tbody tr.k-state-hover {
    background-color: #e6e6ea;
}


Should be

.k-grid tbody > tr:hover, .k-grid tbody > tr.k-state-hover {
    background-color: #e6e6ea;
}

 

I did not search for the source files/lines what might need to change - easy to find in your current version.

There could be many more of these simple improvements which would save many hours on ours side!

Regards,
Jan

 

Unplanned
Last Updated: 20 Dec 2019 07:35 by ADMIN
Created by: utveckling
Comments: 3
Category: Themes
Type: Bug Report
0

Hi,

When using a sass themes , like default-v2 and programmatically execute a set on datasource the dirty-field seems to not have enough time to mark the cell that is changed.

dojo: https://dojo.telerik.com/@utveckling@promosoft.nu/OjebanAX

Original State:

State after cell change:

Unplanned
Last Updated: 30 Oct 2019 15:04 by ADMIN

The problem is easily reproduced using the widget demo page https://demos.telerik.com/kendo-ui/dropdowntree/index

Simply switch to the High Contrast theme; the k-widget element is lacking the border-radius style hence looks different to the other widgets.

It looks like the k-dropdowntree class is missing from the following style rule:

.k-autocomplete, .k-block, .k-calendar-container, .k-colorpicker, .k-combobox, .k-datepicker, .k-datetimepicker, .k-drag-clue, .k-dropdown, .k-dropdown-wrap, .k-editor-inline, .k-grid .k-filter-options, .k-grouping-header .k-group-indicator, .k-inline-block, .k-list-container, .k-multiselect, .k-notification, .k-numeric-wrap, .k-numerictextbox, .k-picker-wrap, .k-slider-selection, .k-slider-track, .k-split-button, .k-textbox, .k-tile, .k-timepicker, .k-tooltip, .k-touch-scrollbar, .k-treeview .k-in, .k-upload, .k-window, .k-window-action, .k-window-titleless .k-window-content {
    border-radius: 13px
}

 

Unplanned
Last Updated: 27 Sep 2019 17:56 by ADMIN
Created by: Naveen
Comments: 1
Category: Themes
Type: Bug Report
7

Bug report

Reproducible with the Default and Bootstrap SASS themes.

Reproduction of the problem

Reproducible in the demos.

  1. Resize the browser window making it more narrow (screencast)

Current behavior

Icons are misaligned.

Expected/desired behavior

Icons are properly aligned.

Environment

  • Kendo UI version: 2019.3.917
  • jQuery version: x.y
  • Browser: [all]
Unplanned
Last Updated: 05 Sep 2019 17:44 by ADMIN

Bug report

Reproduction of the problem

Dojo example.

Current behavior

The mobile material theme does not apply specific styles to a button that has the "km-primary" class. Compare to the Nova mobile theme, which does have specific rules that use ".km-primary" selector.

Expected/desired behavior

CSS rules that use the ".km-primary" selector should be added to the theme.

Environment

  • Kendo UI version: 2019.2.619
  • jQuery version: x.y
  • Browser: [all]
Unplanned
Last Updated: 02 Apr 2019 14:12 by ADMIN
Created by: Dustin
Comments: 1
Category: Themes
Type: Bug Report
0

See demo:

I'm not sure about other themes but this is the one we use.  Submitting so you can provide a fix in next version but can you provide a CSS fix for this that we can add to our page in the meantime?

See attached screenshot.

Thanks!

Unplanned
Last Updated: 29 Mar 2019 07:39 by ADMIN

Hello ladies and gentlemen.

In Bootstrap 4 (and Material) SASS theme the opacity setting for placeholder is missed.

Example: https://demos.telerik.com/kendo-ui/multiselect/index

My fix for Bootstrap 4 (I not known the opacity setting for Material placeholders):

.k-multiselect-wrap {
  > .k-readonly {
    opacity: 0.7;
  }
}
Best regards,
Eduard Töws
Unplanned
Last Updated: 27 Mar 2019 09:19 by ADMIN
Created by: Aleksandr
Comments: 1
Category: Themes
Type: Bug Report
0

a popup opens a little bit wider than screen what cause skills

 

https://dojo.telerik.com/AzOHeDIx/3

 

could you please advise how to proceed?

 

Thx Alex