Writing a Block for Gutenberg WordPress

Project description:
We need a web programmer. You need to write a block for Gutenberg WordPress written in React ES6.
In short:
There is a div with a controller that changes the internal style (inline style) of the padding:
Attributes: {
NewPadding: {
Type: 'number',
Default: 20,
}
Edit: ( props ) = > {
... // controller
Const desktopStyles = {
Padding: newPadding
?

...
Everything works fine, now you need to add, say, media query for the mobile version.
Inline style doesn’t support media query, but I’m sure that somehow you can fit into the style through script.
I write this here because I am very weak on this issue. I think something like this would be perfect:
Attributes: {
NewPadding: {
Type: 'number',
Default: 20,
}
NewMobilePadding: {
Type: 'number',
Default: 0,
}
Edit: ( props ) = > {
... // controller
Const styles = function(){)
If (window.innerwidth)
Only in the right way, you understand me. I'll have questions.
You call the price.