Full screen toggle (fixes #2420)

[svlesiv]

fixes #2420

Screenshots

[yubarajpoudel]

Left margin should be reduced i guess
@paulbert @lmmrssa

[yubarajpoudel]

padding left seems to be big. 10 px looks ok.

[svlesiv]

You are right. Probably I would need to add some media queries for that.

[lmmrssa]

@svlesiv nice work, looks good. There are also other action next to it.
Toggle Preview Toggle Side by Side could you also test with these.

[svlesiv]

@lmmrssa thanks!)
I will try to fix Toggle Preview and Toggle Side by Side.

[svlesiv]

[svlesiv]

[paulbert]

Looking at how the fullscreen is implemented in the text-editor you should be able to fix this by just giving one of the containing elements position: relative;

That would be preferred to all of these small, hardcoded padding & position changes which are more difficult to maintain.

[paulbert]

You can reference the way the component creators implemented it here:
https://teradata.github.io/covalent/#/components/text-editor

[svlesiv]

Hi @paulbert. Thanks for the link. I will take a look and try to implement that technic.

[paulbert]

I looked at this a little more and found what does it: check out the text-editor-demo element in their implementation. It uses position: absolute to stretch the view to fill the screen and transform: translateY(0px) to set that as the containing element for the fixed position editor. Works with the two navigation layouts as is.

[svlesiv]

Thanks for your advice @paulbert. I looked on a demo. Seems like planet code doesn't generate classes for animation. Don't know why.