Skip to content

DOCINFRA-2341_merged_using_automation #131

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Jul 12, 2022
Merged

DOCINFRA-2341_merged_using_automation #131

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
b193d67
SEO-2370_Site_Audit_Issues
gowthamanthavasiyappan Jul 8, 2022
faee821
SEO-2370_Site_Audit_Issues
gowthamanthavasiyappan Jul 8, 2022
78fb77e
Merge remote-tracking branch 'origin/hotfix/hotfix-v20.2.0.36' into S…
gowthamanthavasiyappan Jul 12, 2022
84b6455
Merge pull request #127 from syncfusion-content/SEO-2245_Site_Audit_I…
Aishwarya-Ganesan Jul 12, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 7 additions & 7 deletions angular/Accordion/Appearance-and-Styling.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
---
layout: post
title: Appearance-and-Styling
description: appearance and styling
title: Appearance and Styling in Angular Accordion Control | Syncfusion
description: Learn here about appearance and styling in Syncfusion Essential Angular Accordion Control, its elements, and more.
platform: Angular
control: Accordion
documentation: ug
---

# Appearance and Styling
# Appearance and Styling in Angular Accordion

## Adjusting Accordion size

Expand Down Expand Up @@ -67,7 +67,7 @@ export class AccordionComponent {
Output for Accordion control when panel height is set to auto so that the maximum content height and Fill for minimum content height in all the panels is as follows.


![](Appearance-and-Styling_images/Appearance-and-Styling_img1.png)
![Angular Accordion Rounded corner](Appearance-and-Styling_images/Appearance-and-Styling_img1.png)

## Rounded corner

Expand Down Expand Up @@ -105,7 +105,7 @@ The following steps explains you in enabling the **showRoundedCorner** property

Output for accordion widget when “showRoundedCorner” is set to “true” is as follows.

![](Appearance-and-Styling_images/Appearance-and-Styling_img2.png)
![Angular Accordion Customize Accordion icon](Appearance-and-Styling_images/Appearance-and-Styling_img2.png)

## Customize Accordion icon

Expand Down Expand Up @@ -161,7 +161,7 @@ export class AccordionComponent {

Output for Accordion widget with customized icons is as follows.

![](Appearance-and-Styling_images/Appearance-and-Styling_img3.png)
![Angular Accordion Animations](Appearance-and-Styling_images/Appearance-and-Styling_img3.png)

## Animations

Expand Down Expand Up @@ -306,4 +306,4 @@ Define CSS class for customizing the Accordion.

Output for Accordion with customized CSS property to hide the Accordion icon and format its content is as follows.

![](Appearance-and-Styling_images/Appearance-and-Styling_img4.png)
![Angular Accordion appearance](Appearance-and-Styling_images/Appearance-and-Styling_img4.png)
22 changes: 11 additions & 11 deletions angular/Gantt/Getting-Started.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
layout: post
title: Getting-Started
description: getting started
title: Getting Started with Angular Gantt Control | Syncfusion
description: Learn here about getting started with Syncfusion Essential Angular Gantt Control, its elements, and more.
platform: Angular
control: Gantt
documentation: ug
Expand Down Expand Up @@ -131,7 +131,7 @@ export class AppModule { }

A Gantt Control is created as shown in the following screen shot.

![](Getting-Started_images/Getting-Started_img5.png)
![Angular Gantt Enable Toolbar](Getting-Started_images/Getting-Started_img5.png)

## Enable Toolbar

Expand Down Expand Up @@ -185,7 +185,7 @@ export class DefaultComponent {

The following screen shot displays a Tool bar in Gantt chart control:

![](Getting-Started_images/Getting-Started_img6.png)
![Angular Gantt Enable Sorting](Getting-Started_images/Getting-Started_img6.png)

N> Add, edit, delete, indent and outdent options are enabled when enabling the allowEditing, allowAdding, allowDelete, allowIndent and allowOutdent properties in the edit Options.

Expand Down Expand Up @@ -260,7 +260,7 @@ export class DefaultComponent {

The following screen shot displays a Gantt chart control with Enable Editing options.

![](Getting-Started_images/Getting-Started_img7.png)
![Angular Gantt Enable Context Menu](Getting-Started_images/Getting-Started_img7.png)

N> Both cellEditing and normal editing operations are performed through double-click or single click action that can be defined by editSettings.beginEditAction property.

Expand All @@ -278,7 +278,7 @@ You can enable the context menu in Gantt, by setting the [`enableContextMenu`](h

The following screen shot displays Gantt chart in which Context menu option is enabled:

![](Getting-Started_images/Getting-Started_img8.png)
![Angular Gantt Enable Column Menu](Getting-Started_images/Getting-Started_img8.png)

## Enable Column Menu

Expand All @@ -294,7 +294,7 @@ You can enable the column menu in Gantt, by setting the [`showColumnChooser`](ht

The following screen shot displays Gantt chart in which column chooser option is enabled:

![](Getting-Started_images/Getting-Started_img11.png)
![Angular Gantt Provide tasks relationship](Getting-Started_images/Getting-Started_img11.png)

## Provide tasks relationship

Expand All @@ -319,7 +319,7 @@ You can show the relationship in tasks, by using the [`predecessorMapping`](http

The following screenshot displays the relationship between tasks.

![](Getting-Started_images/Getting-Started_img9.png)
![Angular Gantt Provide Resources](Getting-Started_images/Getting-Started_img9.png)

## Provide Resources

Expand Down Expand Up @@ -371,7 +371,7 @@ export class DefaultComponent {

The following screenshot displays resource allocation for tasks in Gantt chart.

![](Getting-Started_images/Getting-Started_img10.png)
![Angular Gantt Highlight Weekend](Getting-Started_images/Getting-Started_img10.png)

By following these steps, you have learned how to provide data source to Gantt chart, how to configure Gantt to set task relationships, assign resources for each task, and add toolbar with necessary buttons.

Expand All @@ -391,7 +391,7 @@ In Gantt, you can on or off weekends highlighting by setting the [`highlightWeek

The following screen shot displays Gantt chart in which highlight weekends is disabled:

![](Getting-Started_images/Getting-Started_img12.png)
![Angular Gantt Running the application](Getting-Started_images/Getting-Started_img12.png)

## Running the application

Expand All @@ -401,4 +401,4 @@ The following screen shot displays Gantt chart in which highlight weekends is di
npm start
{% endhighlight %}

* Browse to [http://localhost:3000](http://localhost:3000) to see the application. And navigate to Gantt tab. The component is rendered as like the below screenshot. You can make changes in the code found under src folder and the browser should auto-refresh itself while you save files.
* Browse to http://localhost:3000 to see the application. And navigate to Gantt tab. The component is rendered as like the below screenshot. You can make changes in the code found under src folder and the browser should auto-refresh itself while you save files.