Uniformize success/error alerts across forms

src/pages/Settings.jsx

@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import PageLayout from '../components/PageLayout';
+import Alert from '../components/Alert';
 
 const Settings = () => {
   // Estados para armazenar os valores dos sliders e caixas de entrada
@@ -57,19 +58,19 @@ const Settings = () => {
       });
 
       if (response.ok) {
-        setMsg('Configurações de energia atualizadas com sucesso!');
+        setMsg('Alterações guardadas com sucesso!');
       } else {
-        setError('Erro ao atualizar configurações');
+        setError('Erro ao guardar alterações.');
       }
     } catch {
-      setError('Erro ao atualizar configurações');
+      setError('Erro ao guardar alterações.');
     }
   };
 
   return (
     <PageLayout title="Definições de Energia">
-      {msg && <div className="p-2 mb-2 bg-green-600 text-white rounded">{msg}</div>}
-      {error && <div className="p-2 mb-2 bg-red-600 text-white rounded">{error}</div>}
+      {msg && <Alert type="success">{msg}</Alert>}
+      {error && <Alert type="error">{error}</Alert>}
 
       <form className="flex flex-col gap-4" onSubmit={handleSubmit}>
         <div>