refactor(sample) refactor the sample component

[desig9stein]

Closes: #105
To test you need this branch IgniteUI/igniteui-angular-samples#3996

• fix fiter input icon position in none chromium browsers
• fix filtering input jumping in firefox

[ChronosSF]

@desig9stein , so far I am seeing the following issues:

Most grid samples don't show their bottom borders

http://localhost:4321/grid/cell-merging

The fit content implementation seems to work only in FF on Windows and latest Chrome

This is how the first calendar sample looks in FF 152.0.5

But in Edge 150.0.4078.65 it still doesn't work. It seems that the approach might be a bit hit and miss:

But after updating Chrome, the calendar now looks okay there (compared to when I showed it to you)

[desig9stein]

@ChronosSF The shadow cutoff occurs because the new Sample component defaults to 16px of padding around the iframe, and in samples with a hardcoded height, we will see this problem.

I can fix this in a few ways:

Option 1 (Preferred): Remove the internal padding from the sample inside the iframe. (Cleanest long-term, but requires refactoring each affected component).

Option 2 (Fastest): Change the Sample component's default padding to 0. Users who want padding can manually pass spacing="sm|md|lg".

Option 3: Manually increase the hardcoded height for each affected sample.

I lean toward Option 1 to keep things clean, but let me know what you think!