Fix covid examples navigation concept and attribution labels (#9358)

Author: tobiu

examples/component/coronaGallery/Viewport.mjs

@@ -1,4 +1,5 @@
 import BaseViewport       from '../../../src/container/Viewport.mjs';
+import BoxLabel           from '../../../src/component/BoxLabel.mjs';
 import CountryGallery     from './CountryGallery.mjs';
 import Panel              from '../../../src/container/Panel.mjs';
 import RangeField         from '../../../src/form/field/Range.mjs';
@@ -215,38 +216,20 @@ class Viewport extends BaseViewport {
                     }]
                 }]
             }, {
-                ntype: 'label',
-                html : [
+                module: BoxLabel,
+                html  : [
                     '<b>Navigation Concept</b>',
                     '<p>You can use the Arrow Keys to walk through the items.</p>'
-                ].join(''),
-
-                style: {
-                    backgroundColor: '#323232',
-                    color          : '#ddd',
-                    fontSize       : '13px',
-                    margin         : '10px',
-                    padding        : '10px',
-                    whiteSpace     : 'normal'
-                }
+                ].join('')
             }, {
-                ntype: 'label',
-                cls  : ['neo-link-color'],
-                html : [
+                module: BoxLabel,
+                cls   : ['neo-link-color'],
+                html  : [
                     '<b>Attribution</b>',
                     '<p>App created with <a href="https://github.com/neomjs/neo">neo.mjs</a>.</p>',
                     '<p>Data provided by <a href="https://github.com/disease-sh/API">disease-sh/API</a>.</p>',
                     '<p>Country Flag Icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon"> www.flaticon.com</a>.</p>'
-                ].join(''),
-
-                style: {
-                    backgroundColor: '#323232',
-                    color          : '#ddd',
-                    fontSize       : '13px',
-                    margin         : '10px',
-                    padding        : '10px',
-                    whiteSpace     : 'normal'
-                }
+                ].join('')
             }]
         }]
     }

examples/component/coronaHelix/MainContainer.mjs

@@ -1,3 +1,4 @@
+import BoxLabel     from '../../../src/component/BoxLabel.mjs';
 import CheckBox     from '../../../src/form/field/CheckBox.mjs';
 import CountryHelix from './CountryHelix.mjs';
 import Panel        from '../../../src/container/Panel.mjs';
@@ -364,40 +365,22 @@ class MainContainer extends Viewport {
                     }
                 }
             }, {
-                ntype: 'label',
-                text : [
+                module: BoxLabel,
+                html  : [
                     '<b>Navigation Concept</b>',
                     '<p>Click on an item to select it. Afterwards you can use the Arrow Keys to walk through the items.</p>',
                     '<p>Hit the Space Key to rotate the currently selected item to the front.</p>',
                     '<p>Hit the Enter Key to expand the currently selected item.</p>'
-                ].join(''),
-
-                style: {
-                    backgroundColor: '#323232',
-                    color          : '#ddd',
-                    fontSize       : '13px',
-                    margin         : '10px',
-                    padding        : '10px',
-                    whiteSpace     : 'normal'
-                }
+                ].join('')
             }, {
-                ntype: 'label',
-                cls  : ['neo-link-color'],
-                text : [
+                module: BoxLabel,
+                cls   : ['neo-link-color'],
+                html  : [
                     '<b>Attribution</b>',
                     '<p>App created with <a href="https://github.com/neomjs/neo">neo.mjs</a>.</p>',
                     '<p>Data provided by <a href="https://github.com/disease-sh/API">disease.sh/API</a>.</p>',
                     '<p>Icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon"> www.flaticon.com</a>.</p>'
-                ].join(''),
-
-                style: {
-                    backgroundColor: '#323232',
-                    color          : '#ddd',
-                    fontSize       : '13px',
-                    margin         : '10px',
-                    padding        : '10px',
-                    whiteSpace     : 'normal'
-                }
+                ].join('')
             }]
         }]
     }