do stuff

build/manifest.json

@@ -0,0 +1,12 @@
+{
+  "name": "preact-cli app",
+  "start_url": "/",
+  "display": "standalone",
+  "background_color": "#fff",
+  "theme_color": "#673ab8",
+  "icons": [{
+    "src": "/assets/icon.png",
+    "type": "image/png",
+    "sizes": "512x512"
+  }]
+}

build/polyfills.7ee73.js

@@ -0,0 +1,2 @@
+!function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="/",t(t.s="ubxN")}({"1qKe":function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default="function"==typeof fetch?fetch.bind():function(e,t){return t=t||{},new Promise(function(n,o){function r(){var e,t=[],n=[],o={};return i.getAllResponseHeaders().replace(/^(.*?):[^\S\n]*([\s\S]*?)$/gm,function(r,i,u){t.push(i=i.toLowerCase()),n.push([i,u]),e=o[i],o[i]=e?e+","+u:u}),{ok:2==(i.status/100|0),status:i.status,statusText:i.statusText,url:i.responseURL,clone:r,text:function(){return Promise.resolve(i.responseText)},json:function(){return Promise.resolve(i.responseText).then(JSON.parse)},blob:function(){return Promise.resolve(new Blob([i.response]))},headers:{keys:function(){return t},entries:function(){return n},get:function(e){return o[e.toLowerCase()]},has:function(e){return e.toLowerCase()in o}}}}var i=new XMLHttpRequest;i.open(t.method||"get",e,!0);for(var u in t.headers)i.setRequestHeader(u,t.headers[u]);i.withCredentials="include"==t.credentials,i.onload=function(){n(r())},i.onerror=o,i.send(t.body||null)})}},"ar/N":function(e,t,n){e.exports=window.fetch||(window.fetch=n("1qKe").default||n("1qKe"))},f4JX:function(e){var t;t=function(){return this}();try{t=t||Function("return this")()||(0,eval)("this")}catch(e){"object"==typeof window&&(t=window)}e.exports=t},kDDo:function(e){!function(t){function n(){}function o(e,t){return function(){e.apply(t,arguments)}}function r(e){if(!(this instanceof r))throw new TypeError("Promises must be constructed via new");if("function"!=typeof e)throw new TypeError("not a function");this._state=0,this._handled=!1,this._value=void 0,this._deferreds=[],a(e,this)}function i(e,t){for(;3===e._state;)e=e._value;if(0===e._state)return void e._deferreds.push(t);e._handled=!0,r._immediateFn(function(){var n=1===e._state?t.onFulfilled:t.onRejected;if(null===n)return void(1===e._state?u:c)(t.promise,e._value);var o;try{o=n(e._value)}catch(e){return void c(t.promise,e)}u(t.promise,o)})}function u(e,t){try{if(t===e)throw new TypeError("A promise cannot be resolved with itself.");if(t&&("object"==typeof t||"function"==typeof t)){var n=t.then;if(t instanceof r)return e._state=3,e._value=t,void s(e);if("function"==typeof n)return void a(o(n,t),e)}e._state=1,e._value=t,s(e)}catch(t){c(e,t)}}function c(e,t){e._state=2,e._value=t,s(e)}function s(e){2===e._state&&0===e._deferreds.length&&r._immediateFn(function(){e._handled||r._unhandledRejectionFn(e._value)});for(var t=0,n=e._deferreds.length;t<n;t++)i(e,e._deferreds[t]);e._deferreds=null}function f(e,t,n){this.onFulfilled="function"==typeof e?e:null,this.onRejected="function"==typeof t?t:null,this.promise=n}function a(e,t){var n=!1;try{e(function(e){n||(n=!0,u(t,e))},function(e){n||(n=!0,c(t,e))})}catch(e){if(n)return;n=!0,c(t,e)}}var l=setTimeout;r.prototype.catch=function(e){return this.then(null,e)},r.prototype.then=function(e,t){var o=new this.constructor(n);return i(this,new f(e,t,o)),o},r.all=function(e){return new r(function(t,n){function o(e,u){try{if(u&&("object"==typeof u||"function"==typeof u)){var c=u.then;if("function"==typeof c)return void c.call(u,function(t){o(e,t)},n)}r[e]=u,0==--i&&t(r)}catch(e){n(e)}}if(!e||void 0===e.length)throw new TypeError("Promise.all accepts an array");var r=Array.prototype.slice.call(e);if(0===r.length)return t([]);for(var i=r.length,u=0;u<r.length;u++)o(u,r[u])})},r.resolve=function(e){return e&&"object"==typeof e&&e.constructor===r?e:new r(function(t){t(e)})},r.reject=function(e){return new r(function(t,n){n(e)})},r.race=function(e){return new r(function(t,n){for(var o=0,r=e.length;o<r;o++)e[o].then(t,n)})},r._immediateFn="function"==typeof setImmediate&&function(e){setImmediate(e)}||function(e){l(e,0)},r._unhandledRejectionFn=function(e){"undefined"!=typeof console&&console&&console.warn("Possible Unhandled Promise Rejection:",e)},r._setImmediateFn=function(e){r._immediateFn=e},r._setUnhandledRejectionFn=function(e){r._unhandledRejectionFn=e},void 0!==e&&e.exports?e.exports=r:t.Promise||(t.Promise=r)}(this)},ubxN:function(e,t,n){"use strict";(function(e){e.Promise||(e.Promise=n("kDDo")),e.fetch||(e.fetch=n("ar/N"))}).call(t,n("f4JX"))}});
+//# sourceMappingURL=polyfills.7ee73.js.map

build/push-manifest.json

@@ -0,0 +1 @@
+{"/":{"style.2e25c.css":{"type":"style","weight":1},"bundle.80c34.js":{"type":"script","weight":1}}}

build/ssr-build/style.2e25c.css

@@ -0,0 +1,2 @@
+*{-webkit-box-sizing:border-box;box-sizing:border-box}body{background-color:#0d193b;color:#a0ccff;font-family:sans-serif}h1,h2,h3,h4,h5,h6{text-align:center;margin-top:4px;margin-bottom:4px;color:#fff;font-weight:400}a{color:#00caca;text-decoration:none}a:hover{color:#4affff}a:active{color:#fff}.panel__1ubJw{background-color:rgba(62.7%,80%,100%,10%);padding:4px;border-radius:4px;margin:4px;height:calc(100% - 8px);min-width:200px}.latex__3Esv7{display:inline-block;vertical-align:middle}.split__3qCWp{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.splitchild__3cEoc{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0;-ms-flex-preferred-size:0;flex-basis:0}.plus__29_QM{color:#ff7d7d}.minus__2Ld4F{color:#7d7dff}.todo__1pOoN{border:4px solid #ff0;border-radius:4px;padding:2px;background-color:#000;color:#ff0}.copyright__2FTnU{margin-top:8px;color:#fff;text-align:center;font-size:x-small}
+/*# sourceMappingURL=style.2e25c.css.map*/

build/ssr-build/style.2e25c.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["webpack:///./index.css","webpack:///./components/panel.css","webpack:///./components/latex.css","webpack:///./components/split.css","webpack:///./components/plus.css","webpack:///./components/minus.css","webpack:///./components/todo.css","webpack:///./components/copyright.css"],"names":[],"mappings":"AAAA,EACC,8BAAuB,sBAGxB,KACC,yBACA,cACA,sBAAwB,CAGzB,kBACC,kBACA,eACA,kBACA,WACA,eAAoB,CAGrB,EACI,cACA,oBAAsB,CAG1B,QACC,aAAe,CAGhB,SACC,UAAe,CC5BhB,cACI,0CACA,YACA,kBACA,WACA,wBACA,eAAiB,CCNrB,cACI,qBACA,qBAAuB,CCF3B,cACI,oBAAc,iCACd,mBAAgB,eAGpB,mBACI,mBAAa,gCACb,oBAAe,cACf,0BAAc,aCRlB,aACI,aAAe,CCDnB,cACI,aAAe,CCDnB,aACI,sBACA,kBACA,YACA,sBACA,UAAc,CCLlB,kBACI,eACA,WACA,kBACA,iBAAmB","file":"style.2e25c.css","sourcesContent":["* {\n\tbox-sizing: border-box;\n}\n\nbody {\n\tbackground-color: #0d193b;\n\tcolor: #a0ccff;\n\tfont-family: sans-serif;\n}\n\nh1, h2, h3, h4, h5, h6 {\n\ttext-align: center;\n\tmargin-top: 4px;\n\tmargin-bottom: 4px;\n\tcolor: #ffffff;\n\tfont-weight: normal;\n}\n\na {\n    color: #00caca;\n    text-decoration: none;\n}\n\na:hover {\n\tcolor: #4affff;\n}\n\na:active {\n\tcolor: #ffffff;\n}\n\n\n// WEBPACK FOOTER //\n// ./index.css",".panel {\n    background-color: rgba(62.7%, 80%, 100%, 10%);\n    padding: 4px;\n    border-radius: 4px;\n    margin: 4px;\n    height: calc(100% - 8px);\n    min-width: 200px;\n}\n\n\n// WEBPACK FOOTER //\n// ./components/panel.css",".latex {\n    display: inline-block;\n    vertical-align: middle;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./components/latex.css",".split {\n    display: flex;\n    flex-wrap: wrap;\n}\n\n.splitchild {\n    flex-grow: 1;\n    flex-shrink: 0;\n    flex-basis: 0;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./components/split.css",".plus {\n    color: #ff7d7d;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./components/plus.css",".minus {\n    color: #7d7dff;\n}\n\n\n// WEBPACK FOOTER //\n// ./components/minus.css",".todo {\n    border: 4px yellow solid;\n    border-radius: 4px;\n    padding: 2px;\n    background-color: black;\n    color: yellow;\n}\n\n\n// WEBPACK FOOTER //\n// ./components/todo.css",".copyright {\n    margin-top: 8px;\n    color: white;\n    text-align: center;\n    font-size: x-small;\n}\n\n\n// WEBPACK FOOTER //\n// ./components/copyright.css"],"sourceRoot":""}

build/style.2e25c.css

@@ -0,0 +1,2 @@
+*{-webkit-box-sizing:border-box;box-sizing:border-box}body{background-color:#0d193b;color:#a0ccff;font-family:sans-serif}h1,h2,h3,h4,h5,h6{text-align:center;margin-top:4px;margin-bottom:4px;color:#fff;font-weight:400}a{color:#00caca;text-decoration:none}a:hover{color:#4affff}a:active{color:#fff}.panel__1ubJw{background-color:rgba(62.7%,80%,100%,10%);padding:4px;border-radius:4px;margin:4px;height:calc(100% - 8px);min-width:200px}.latex__3Esv7{display:inline-block;vertical-align:middle}.split__3qCWp{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.splitchild__3cEoc{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-ms-flex-negative:0;flex-shrink:0;-ms-flex-preferred-size:0;flex-basis:0}.plus__29_QM{color:#ff7d7d}.minus__2Ld4F{color:#7d7dff}.todo__1pOoN{border:4px solid #ff0;border-radius:4px;padding:2px;background-color:#000;color:#ff0}.copyright__2FTnU{margin-top:8px;color:#fff;text-align:center;font-size:x-small}
+/*# sourceMappingURL=style.2e25c.css.map*/

build/style.2e25c.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["webpack:///./index.css","webpack:///./components/panel.css","webpack:///./components/latex.css","webpack:///./components/split.css","webpack:///./components/plus.css","webpack:///./components/minus.css","webpack:///./components/todo.css","webpack:///./components/copyright.css"],"names":[],"mappings":"AAAA,EACC,8BAAuB,sBAGxB,KACC,yBACA,cACA,sBAAwB,CAGzB,kBACC,kBACA,eACA,kBACA,WACA,eAAoB,CAGrB,EACI,cACA,oBAAsB,CAG1B,QACC,aAAe,CAGhB,SACC,UAAe,CC5BhB,cACI,0CACA,YACA,kBACA,WACA,wBACA,eAAiB,CCNrB,cACI,qBACA,qBAAuB,CCF3B,cACI,oBAAc,iCACd,mBAAgB,eAGpB,mBACI,mBAAa,gCACb,oBAAe,cACf,0BAAc,aCRlB,aACI,aAAe,CCDnB,cACI,aAAe,CCDnB,aACI,sBACA,kBACA,YACA,sBACA,UAAc,CCLlB,kBACI,eACA,WACA,kBACA,iBAAmB","file":"style.2e25c.css","sourcesContent":["* {\n\tbox-sizing: border-box;\n}\n\nbody {\n\tbackground-color: #0d193b;\n\tcolor: #a0ccff;\n\tfont-family: sans-serif;\n}\n\nh1, h2, h3, h4, h5, h6 {\n\ttext-align: center;\n\tmargin-top: 4px;\n\tmargin-bottom: 4px;\n\tcolor: #ffffff;\n\tfont-weight: normal;\n}\n\na {\n    color: #00caca;\n    text-decoration: none;\n}\n\na:hover {\n\tcolor: #4affff;\n}\n\na:active {\n\tcolor: #ffffff;\n}\n\n\n// WEBPACK FOOTER //\n// ./index.css",".panel {\n    background-color: rgba(62.7%, 80%, 100%, 10%);\n    padding: 4px;\n    border-radius: 4px;\n    margin: 4px;\n    height: calc(100% - 8px);\n    min-width: 200px;\n}\n\n\n// WEBPACK FOOTER //\n// ./components/panel.css",".latex {\n    display: inline-block;\n    vertical-align: middle;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./components/latex.css",".split {\n    display: flex;\n    flex-wrap: wrap;\n}\n\n.splitchild {\n    flex-grow: 1;\n    flex-shrink: 0;\n    flex-basis: 0;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./components/split.css",".plus {\n    color: #ff7d7d;\n}\n\n\n\n// WEBPACK FOOTER //\n// ./components/plus.css",".minus {\n    color: #7d7dff;\n}\n\n\n// WEBPACK FOOTER //\n// ./components/minus.css",".todo {\n    border: 4px yellow solid;\n    border-radius: 4px;\n    padding: 2px;\n    background-color: black;\n    color: yellow;\n}\n\n\n// WEBPACK FOOTER //\n// ./components/todo.css",".copyright {\n    margin-top: 8px;\n    color: white;\n    text-align: center;\n    font-size: x-small;\n}\n\n\n// WEBPACK FOOTER //\n// ./components/copyright.css"],"sourceRoot":""}

build/sw.js

@@ -0,0 +1 @@
+"use strict";var precacheConfig=[["/assets/icon.png","cf3fdf7af60a294d6d3f48cb7ad82488"],["/bundle.80c34.js","1f51ff262c23e38586dfe440115b3df4"],["/favicon.ico","94eae66bebbd6bbfe48a669f245048ac"],["/index.html","18c9e371a5ae371806f1538ddb6ed283"],["/manifest.json","310a916537fc6f66deb88310b13a2759"],["/style.2e25c.css","98d6910a3458e82344ba6698ddfba860"]],cacheName="sw-precache-v3-sw-precache-webpack-plugin-"+(self.registration?self.registration.scope:""),ignoreUrlParametersMatching=[/^utm_/],addDirectoryIndex=function(e,t){var n=new URL(e);return"/"===n.pathname.slice(-1)&&(n.pathname+=t),n.toString()},cleanResponse=function(e){return e.redirected?("body"in e?Promise.resolve(e.body):e.blob()).then(function(t){return new Response(t,{headers:e.headers,status:e.status,statusText:e.statusText})}):Promise.resolve(e)},createCacheKey=function(e,t,n,r){var a=new URL(e);return r&&a.pathname.match(r)||(a.search+=(a.search?"&":"")+encodeURIComponent(t)+"="+encodeURIComponent(n)),a.toString()},isPathWhitelisted=function(e,t){if(0===e.length)return!0;var n=new URL(t).pathname;return e.some(function(e){return n.match(e)})},stripIgnoredUrlParameters=function(e,t){var n=new URL(e);return n.hash="",n.search=n.search.slice(1).split("&").map(function(e){return e.split("=")}).filter(function(e){return t.every(function(t){return!t.test(e[0])})}).map(function(e){return e.join("=")}).join("&"),n.toString()},hashParamName="_sw-precache",urlsToCacheKeys=new Map(precacheConfig.map(function(e){var t=e[0],n=e[1],r=new URL(t,self.location),a=createCacheKey(r,hashParamName,n,!1);return[r.toString(),a]}));function setOfCachedUrls(e){return e.keys().then(function(e){return e.map(function(e){return e.url})}).then(function(e){return new Set(e)})}self.addEventListener("install",function(e){e.waitUntil(caches.open(cacheName).then(function(e){return setOfCachedUrls(e).then(function(t){return Promise.all(Array.from(urlsToCacheKeys.values()).map(function(n){if(!t.has(n)){var r=new Request(n,{credentials:"same-origin"});return fetch(r).then(function(t){if(!t.ok)throw new Error("Request for "+n+" returned a response with status "+t.status);return cleanResponse(t).then(function(t){return e.put(n,t)})})}}))})}).then(function(){return self.skipWaiting()}))}),self.addEventListener("activate",function(e){var t=new Set(urlsToCacheKeys.values());e.waitUntil(caches.open(cacheName).then(function(e){return e.keys().then(function(n){return Promise.all(n.map(function(n){if(!t.has(n.url))return e.delete(n)}))})}).then(function(){return self.clients.claim()}))}),self.addEventListener("fetch",function(e){if("GET"===e.request.method){var t,n=stripIgnoredUrlParameters(e.request.url,ignoreUrlParametersMatching);(t=urlsToCacheKeys.has(n))||(n=addDirectoryIndex(n,"index.html"),t=urlsToCacheKeys.has(n));!t&&"navigate"===e.request.mode&&isPathWhitelisted(["^(?!\\/__).*"],e.request.url)&&(n=new URL("index.html",self.location).toString(),t=urlsToCacheKeys.has(n)),t&&e.respondWith(caches.open(cacheName).then(function(e){return e.match(urlsToCacheKeys.get(n)).then(function(e){if(e)return e;throw Error("The cached response that was expected is missing.")})}).catch(function(t){return console.warn('Couldn\'t serve response for "%s" from cache: %O',e.request.url,t),fetch(e.request)}))}});

src/pages/fisica.js

@@ -75,6 +75,22 @@ export default class Fisica extends Component {
                             Produce il modulo della proiezione di <Latex>{r`\vec{a}`}</Latex> su <Latex>{r`\vec{b}`}</Latex>.
                         </p>
                     </Panel>
+                    <Panel>
+                        <h3>
+                            Prodotto vettoriale
+                        </h3>
+                        <p>
+                            Si chiama vettoriale perchè il risultato è un altro vettore.
+                        </p>
+                        <ul>
+                            <li><Latex>{r`\vec{c} = \vec{a} \times \vec{b}`}</Latex></li>
+                            <li><Latex>{r`\left | \vec{c} \right | = \left | \vec{a} \right | \cdot \left | \vec{b} \right | \cdot \sin(\alpha)`}</Latex></li>
+                            <li><a href="https://it.wikipedia.org/wiki/Regola_della_mano_destra">Regola della mano destra</a></li>
+                        </ul>
+                        <p>
+                            Non è commutativo!
+                        </p>
+                    </Panel>
                 </Split>
                 <h2>
                     Leggi di Newton
@@ -966,10 +982,10 @@ export default class Fisica extends Component {
                             Amperometro
                         </h3>
                         <p>
-                            Misura la corrente elettrica se messo in serie al componente da misurare.
+                            Misura la corrente elettrica se messo in serie.
                         </p>
                         <p>
-                            (Funzionamento: ha una resistenza interna bassisima che non influisce significativamente sulla corrente.)
+                            (Funzionamento: ha una resistenza interna bassisima in modo da non influire significativamente sulla corrente.)
                         </p>
                     </Panel>
                     <Panel>
@@ -977,7 +993,10 @@ export default class Fisica extends Component {
                             Voltmetro
                         </h3>
                         <p>
-                            <Todo>Cos'è?</Todo>
+                            Misura la differenza di potenziale se messo in parallelo.
+                        </p>
+                        <p>
+                            (Funzionamento: ha una resistenza altissima in modo da non influire significativamente sulla tensione.)
                         </p>
                     </Panel>
                 </Split>
@@ -990,7 +1009,7 @@ export default class Fisica extends Component {
                             Legge dei nodi
                         </h3>
                         <p>
-                            <Todo>Cos'è un nodo?</Todo>
+                            Per nodo si intende un qualsiasi punto del circuito.
                         </p>
                         <p>
                             Da un nodo entra ed esce la stessa corrente.
@@ -1001,7 +1020,7 @@ export default class Fisica extends Component {
                             Legge delle maglie
                         </h3>
                         <p>
-                            <Todo>Cos'è una maglia?</Todo>
+                            Per maglia si intende un qualsiasi percorso chiuso all'interno del circuito.
                         </p>
                         <p>
                             In una maglia chiusa, la somma delle differenze di potenziale è 0.
@@ -1089,6 +1108,104 @@ export default class Fisica extends Component {
                         </p>
                     </Panel>
                 </Split>
+                <h2>
+                    Magnetismo
+                </h2>
+                <Split>
+                    <Panel>
+                        <h3>
+                            Campo magnetico
+                        </h3>
+                        <p>
+                            Come un campo elettrico, ma per i magneti.
+                        </p>
+                        <p>
+                            <Latex>B</Latex>
+                        </p>
+                        <p>
+                            La sua unità di misura è il Tesla (<Latex>T</Latex>).
+                        </p>
+                    </Panel>
+                    <Panel>
+                        <h3>
+                            Flusso magnetico
+                        </h3>
+                        <p>
+                            Come il flusso elettrico, ma per campi magnetici.
+                        </p>
+                    </Panel>
+                    <Panel>
+                        <h3>
+                            Legge di Gauss per il magnetismo
+                        </h3>
+                        <p>
+                            Il flusso magnetico attraverso qualsiasi superficie chiusa è sempre nullo.
+                        </p>
+                    </Panel>
+                </Split>
+                <Split>
+                    <Panel>
+                        <h3>
+                            Forza magnetica su carica puntiforme
+                        </h3>
+                        <p>
+                            <i>Anche detta <b>forza di Lorentz</b>.</i>
+                        </p>
+                        <p>
+                            I campi magnetici applicano una forza sulle cariche vicine:
+                        </p>
+                        <p>
+                            <Latex>{r`\vec{F}_{magnetica} = q \cdot (\vec{v} \times \vec{B})`}</Latex>
+                        </p>
+                        <p>
+                            Dove <Latex>{r`\vec{B}`}</Latex> è l'intensità del campo magnetico e <Latex>{r`\vec{v}`}</Latex> la velocità della carica considerata.
+                        </p>
+                        <p>
+                            Si ha una forza massima se la velocità è perpendicolare al campo magnetico.
+                        </p>
+                        <p>
+                            In un campo magnetico uniforme, una velocità perpendicolare al campo porta alla creazione di un moto circolare uniforme.
+                        </p>
+                    </Panel>
+                    <Panel>
+                        <h3>
+                            Forza magnetica in un filo
+                        </h3>
+                        <p>
+                            I campi magnetici influenzano anche le cariche presenti in un conduttore:
+                        </p>
+                        <p>
+                            <Latex>{r`\vec{F} = I \cdot (\vec{L} \times \vec{B})`}</Latex>
+                        </p>
+                    </Panel>
+                </Split>
+                <h2>
+                    Campi magnetici
+                </h2>
+                <Split>
+                    <Panel>
+                        <h3>
+                            Campo magnetico in una spira
+                        </h3>
+                        <p>
+                            Una spira in cui passa corrente produce un campo magnetico perpendicolare al piano creato dalla spira.
+                        </p>
+                    </Panel>
+                    <Panel>
+                        <h3>
+                            Campo magnetico di un solenoide
+                        </h3>
+                        <p>
+                            Un solenoide sono tante spire avvolte in modo da formare una specie di cilindro.
+                        </p>
+                        <p>
+                            All'interno del solenoide si crea un campo (quasi) uniforme:
+                        </p>
+                        <p>
+                            <Latex>{r`B = \mu_0 \cdot I \cdot \frac{A_{vvolgimenti}}{L_unghezzafilo}`}</Latex>
+                        </p>
+                    </Panel>
+                </Split>
             </div>
         )
 	}