diff --git a/.env b/.env
index e9b5f94..362de50 100644
--- a/.env
+++ b/.env
@@ -1 +1,5 @@
-REACT_APP_GITHUB_TOKEN=your_github_token_here
\ No newline at end of file
+REACT_APP_GITHUB_TOKEN=your_github_token_here
+REACT_APP_GITEA_TOKEN=your_gitea_token_here
+GITEA_API_URL='https://git.konceptkit.com/'
+GITHUB_API_URL='https://api.github.com/'
+GITEA_ACCESS_TOKEN='de037d3d8b7268acd0dc734a83799e4f3761bad3'
\ No newline at end of file
diff --git a/README.md b/README.md
index c2214f2..4e95718 100644
--- a/README.md
+++ b/README.md
@@ -78,3 +78,4 @@ npm install recharts            # Commit activity charts
 npm install react-tooltip       # Tooltips for commit details
 
 
+Is there a limit with gitea Api?
\ No newline at end of file
diff --git a/src/App.tsx b/src/App.tsx
index d091f8a..f38fdfa 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,15 +1,20 @@
 // In your main app
-import GitHubWidget from "./components/GitHubWidget";
+import { GitHubWidget, GiteaWidget } from "./components/GitWidget";
 
 export default function App() {
   return (
     <div className="bg-slate-800 py-20">
       <GitHubWidget
-        defaultRepo="comfy-org/comfyui-frontend"
+        defaultRepo="kayela-c/puck"
         limit={8}
         title="Recent Activity"
         // token={process.env.REACT_APP_GITHUB_TOKEN} // Optional for private repos
       />
+      <GiteaWidget
+        defaultRepo="andika/membership-fe"
+        limit={8}
+        title="Recent Activity"
+      />
     </div>
   );
 }
diff --git a/src/components/GitHubWidget/index.ts b/src/components/GitHubWidget/index.ts
deleted file mode 100644
index 0ace454..0000000
--- a/src/components/GitHubWidget/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-// components/GitHubWidget/index.js
-export { default } from './GitHubWidget';
\ No newline at end of file
diff --git a/src/components/GitHubWidget/GitHubCommitItem.tsx b/src/components/GitWidget/GitHubCommitItem.tsx
similarity index 74%
rename from src/components/GitHubWidget/GitHubCommitItem.tsx
rename to src/components/GitWidget/GitHubCommitItem.tsx
index 0db9862..5c8faff 100644
--- a/src/components/GitHubWidget/GitHubCommitItem.tsx
+++ b/src/components/GitWidget/GitHubCommitItem.tsx
@@ -1,4 +1,3 @@
-// components/GitHubWidget/GitHubCommitItem.jsx
 import React from 'react';
 import { formatDistanceToNow } from 'date-fns';
 import { FaCodeBranch, FaUser, FaCalendar } from 'react-icons/fa';
@@ -9,34 +8,34 @@ const GitHubCommitItem = ({ commit }) => {
   
   return (
     <div className="github-commit-item">
-      <div className="commit-header">
+      <div className="github-commit-header">
         <a 
           href={html_url} 
           target="_blank" 
           rel="noopener noreferrer"
-          className="commit-sha"
+          className="github-commit-sha"
         >
           <FaCodeBranch /> {sha.substring(0, 7)}
         </a>
-        <span className="commit-time">
+        <span className="github-commit-time">
           <FaCalendar /> {formatDistanceToNow(new Date(commitData.author.date))} ago
         </span>
       </div>
       
-      <div className="commit-message">
+      <div className="github-commit-message">
         <ReactMarkdown>
           {commitData.message.split('\n')[0]}
         </ReactMarkdown>
       </div>
       
       {author && (
-        <div className="commit-author">
+        <div className="github-commit-author">
           <img 
             src={author.avatar_url} 
             alt={commitData.author.name}
-            className="author-avatar"
+            className="github-author-avatar"
           />
-          <span className="author-name">
+          <span className="github-author-name">
             <FaUser /> {commitData.author.name}
           </span>
         </div>
diff --git a/src/components/GitHubWidget/GitHubWidget.tsx b/src/components/GitWidget/GitHubWidget.tsx
similarity index 51%
rename from src/components/GitHubWidget/GitHubWidget.tsx
rename to src/components/GitWidget/GitHubWidget.tsx
index 7e77409..837cc9f 100644
--- a/src/components/GitHubWidget/GitHubWidget.tsx
+++ b/src/components/GitWidget/GitHubWidget.tsx
@@ -1,20 +1,20 @@
-// components/GitHubWidget/GitHubWidget.jsx
-import React, { useState } from 'react';
-import useGitHubCommits from '../../hooks/useGitHubCommits';
-import GitHubCommitItem from './GitHubCommitItem';
-import { FaGithub, FaSync, FaExclamationTriangle } from 'react-icons/fa';
+import React, { useState } from "react";
+import useGitHubCommits from "../../hooks/useGitHubCommits";
+import GitHubCommitItem from "./GitHubCommitItem";
+import { FaGithub, FaSync, FaExclamationTriangle } from "react-icons/fa";
 
+import "../../styles/GitHubWidget.css";
 
-const GitHubWidget = ({ 
-  defaultRepo = 'facebook/react',
+export const GitHubWidget = ({
+  defaultRepo = "facebook/react",
   token = null,
   limit = 5,
-  title = 'Recent Commits'
+  title = "Recent Commits",
 }) => {
   const [repo, setRepo] = useState(defaultRepo);
   const [inputRepo, setInputRepo] = useState(defaultRepo);
-  
-  const { commits, loading, error } = useGitHubCommits(repo, token, limit);
+
+  const { commits, loading, error } = useGitHubCommits(repo, token);
 
   const handleRepoChange = (e) => {
     setInputRepo(e.target.value);
@@ -22,17 +22,17 @@ const GitHubWidget = ({
 
   const handleSubmit = (e) => {
     e.preventDefault();
-    if (inputRepo.includes('/')) {
+    if (inputRepo.includes("/")) {
       setRepo(inputRepo);
     }
   };
 
   return (
-    <div className="github-widget border-[#e1e4e8] rounded-3xl shadow-sm">
-      <div className="widget-header">
+    <div className="github-widget border-[#e1e4e8] rounded-2xl shadow-sm border-l-8 border-l-slate-200">
+      <div className="github-widget-header rounded-t-2xl">
         <FaGithub className="github-icon" />
         <h3>{title}</h3>
-        <form onSubmit={handleSubmit} className="repo-form">
+        <form onSubmit={handleSubmit} className="github-repo-form">
           <input
             type="text"
             value={inputRepo}
@@ -40,48 +40,44 @@ const GitHubWidget = ({
             placeholder="owner/repo"
             className="repo-input"
           />
-          <button type="submit" className="refresh-btn">
+          <button type="submit" className="github-refresh-btn">
             <FaSync />
           </button>
         </form>
       </div>
 
-      <div className="widget-body">
+      <div className="github-widget-body">
         {loading ? (
-          <div className="loading">Loading commits...</div>
+          <div className="github-loading">Loading commits...</div>
         ) : error ? (
-          <div className="error">
+          <div className="github-error">
             <FaExclamationTriangle />
             <p>Error: {error}</p>
           </div>
         ) : (
-          <div className="commits-list">
+          <div className="github-commits-list">
             {commits.length > 0 ? (
               commits.map((commit) => (
-                <GitHubCommitItem 
-                  key={commit.sha} 
-                  commit={commit} 
-                />
+                <GitHubCommitItem key={commit.sha} commit={commit} />
               ))
             ) : (
-              <div className="no-commits">No commits found</div>
+              <div className="github-no-commits">No commits found</div>
             )}
           </div>
         )}
       </div>
-      
-      <div className="widget-footer">
-        <a 
+
+      <div className="github-widget-footer">
+        <a
           href={`https://github.com/${repo}`}
           target="_blank"
           rel="noopener noreferrer"
-          className="view-all"
+          className="github-view-all"
         >
-          View on GitHub →
+          View Git →
         </a>
       </div>
     </div>
   );
 };
 
-export default GitHubWidget;
\ No newline at end of file
diff --git a/src/components/GitWidget/GiteaCommitItem.tsx b/src/components/GitWidget/GiteaCommitItem.tsx
new file mode 100644
index 0000000..646525b
--- /dev/null
+++ b/src/components/GitWidget/GiteaCommitItem.tsx
@@ -0,0 +1,55 @@
+import React from 'react';
+import { formatDistanceToNow } from 'date-fns';
+import { FaCodeBranch, FaUser, FaCalendar, FaCode } from 'react-icons/fa';
+
+const GiteaCommitItem = ({ commit, giteaUrl, repo }) => {
+  const { sha, commit: commitData, author, html_url } = commit;
+  
+  // Gitea's commit structure is slightly different
+  const commitMessage = commitData?.message || '';
+  const commitAuthor = commitData?.author?.name || '';
+  const commitDate = commitData?.author?.date || '';
+  
+  // Build URL for Gitea
+  const commitUrl = html_url || `${giteaUrl}/${repo}/commit/${sha}`;
+  
+  return (
+    <div className="gitea-commit-item">
+      <div className="commit-header">
+        <a 
+          href={commitUrl}
+          target="_blank" 
+          rel="noopener noreferrer"
+          className="commit-sha"
+        >
+          <FaCode /> {sha.substring(0, 7)}
+        </a>
+        <span className="commit-time">
+          <FaCalendar /> {commitDate ? formatDistanceToNow(new Date(commitDate)) + ' ago' : 'Unknown date'}
+        </span>
+      </div>
+      
+      <div className="commit-message">
+        {commitMessage.split('\n')[0]}
+      </div>
+      
+      <div className="commit-author">
+        {author?.avatar_url && (
+          <img 
+            src={author.avatar_url} 
+            alt={commitAuthor}
+            className="author-avatar"
+            onError={(e) => {
+              e.target.style.display = 'none';
+            }}
+          />
+        )}
+        <span className="author-name">
+          <FaUser /> {commitAuthor || 'Unknown'}
+        </span>
+      </div>
+    </div>
+  );
+};
+
+export default GiteaCommitItem;
\ No newline at end of file
diff --git a/src/components/GitWidget/GiteaWidget.tsx b/src/components/GitWidget/GiteaWidget.tsx
new file mode 100644
index 0000000..16ef15d
--- /dev/null
+++ b/src/components/GitWidget/GiteaWidget.tsx
@@ -0,0 +1,200 @@
+import React, { useState } from "react";
+import useGiteaCommits from "../../hooks/useGiteaCommits";
+import GiteaCommitItem from "./GiteaCommitItem";
+import "../../styles/GiteaWidget.css";
+import {
+  FaCodeBranch,
+  FaSync,
+  FaExclamationTriangle,
+  FaServer,
+} from "react-icons/fa";
+
+export const GiteaWidget = ({
+  defaultGiteaUrl = "https://git.konceptkit.com/",
+  defaultRepo = "owner/repo",
+  token = null,
+  limit = 5,
+  branch = "main",
+  title = "Recent Commits",
+}) => {
+  const [giteaUrl, setGiteaUrl] = useState(defaultGiteaUrl);
+  const [repo, setRepo] = useState(defaultRepo);
+  const [inputGiteaUrl, setInputGiteaUrl] = useState(defaultGiteaUrl);
+  const [inputRepo, setInputRepo] = useState(defaultRepo);
+  const [showAdvanced, setShowAdvanced] = useState(false);
+
+  const { commits, loading, error } = useGiteaCommits(
+    giteaUrl,
+    repo,
+    token,
+    limit,
+    branch
+  );
+
+  const handleSubmit = (e) => {
+    e.preventDefault();
+
+    // Validate URL
+    let url = inputGiteaUrl;
+    if (!url.startsWith("http")) {
+      url = `https://${url}`;
+    }
+
+    // Remove trailing slash if present
+    url = url.replace(/\/$/, "");
+
+    setGiteaUrl(url);
+
+    // Validate repo format
+    if (inputRepo.includes("/")) {
+      setRepo(inputRepo);
+    } else {
+      alert('Repository must be in format "owner/repo"');
+    }
+  };
+
+  // Example preset repositories
+  const presetRepos = [
+    { label: "Documentation", value: "owner/docs" },
+    { label: "API Server", value: "owner/api-server" },
+    { label: "Web App", value: "owner/web-app" },
+  ];
+
+  return (
+    <div className="gitea-widget border-[#e1e4e8] rounded-2xl shadow-sm border-l-8 border-l-lime-600">
+      <div className="github-widget-header rounded-t-2xl">
+        <FaServer className="gitea-icon" />
+        <h3>{title}</h3>
+
+        <button
+          className="advanced-toggle"
+          onClick={() => setShowAdvanced(!showAdvanced)}
+        >
+          {showAdvanced ? "Simple" : "Advanced"}
+        </button>
+      </div>
+
+      {showAdvanced ? (
+        <form onSubmit={handleSubmit} className="config-form">
+          <div className="form-group">
+            <label>
+              <FaServer /> Gitea Instance URL
+            </label>
+            <input
+              type="text"
+              value={inputGiteaUrl}
+              onChange={(e) => setInputGiteaUrl(e.target.value)}
+              placeholder="https://gitea.example.com"
+              className="url-input"
+            />
+          </div>
+
+          <div className="form-group">
+            <label>
+              <FaCodeBranch /> Repository
+            </label>
+            <input
+              type="text"
+              value={inputRepo}
+              onChange={(e) => setInputRepo(e.target.value)}
+              placeholder="owner/repository"
+              className="repo-input"
+            />
+            <div className="preset-repos">
+              {presetRepos.map((preset) => (
+                <button
+                  key={preset.value}
+                  type="button"
+                  className="preset-btn"
+                  onClick={() => setInputRepo(preset.value)}
+                >
+                  {preset.label}
+                </button>
+              ))}
+            </div>
+          </div>
+
+          <button type="submit" className="refresh-btn">
+            <FaSync /> Load Commits
+          </button>
+        </form>
+      ) : (
+        <form onSubmit={handleSubmit} className="simple-form">
+          <div className="input-group">
+            <input
+              type="text"
+              value={inputRepo}
+              onChange={(e) => setInputRepo(e.target.value)}
+              placeholder="owner/repo"
+              className="simple-input"
+            />
+            <button type="submit" className="simple-btn">
+              <FaSync />
+            </button>
+          </div>
+        </form>
+      )}
+
+      <div className="current-config">
+        <small>
+          Instance: <code>{giteaUrl}</code> | Repo: <code>{repo}</code> |
+          Branch: <code>{branch}</code>
+        </small>
+      </div>
+
+      <div className="widget-body">
+        {loading ? (
+          <div className="loading">
+            <div className="spinner"></div>
+            Loading commits from {repo}...
+          </div>
+        ) : error ? (
+          <div className="error">
+            <FaExclamationTriangle />
+            <div className="error-details">
+              <p>Failed to load commits</p>
+              <small>{error}</small>
+              <p className="help-text">
+                Ensure:
+                <ul>
+                  <li>Gitea instance is accessible</li>
+                  <li>Repository exists and is accessible</li>
+                  <li>API token has correct permissions (if private repo)</li>
+                </ul>
+              </p>
+            </div>
+          </div>
+        ) : (
+          <div className="commits-list">
+            {commits.length > 0 ? (
+              commits.map((commit) => (
+                <GiteaCommitItem
+                  key={commit.sha}
+                  commit={commit}
+                  giteaUrl={giteaUrl}
+                  repo={repo}
+                />
+              ))
+            ) : (
+              <div className="no-commits">
+                No commits found in the {branch} branch
+              </div>
+            )}
+          </div>
+        )}
+      </div>
+
+      <div className="widget-footer">
+        <a
+          href={`${giteaUrl}/${repo}`}
+          target="_blank"
+          rel="noopener noreferrer"
+          className="view-all"
+        >
+          View on Gitea →
+        </a>
+        <span className="commit-count">{commits.length} commits shown</span>
+      </div>
+    </div>
+  );
+};
diff --git a/src/components/GitWidget/index.ts b/src/components/GitWidget/index.ts
new file mode 100644
index 0000000..76683e8
--- /dev/null
+++ b/src/components/GitWidget/index.ts
@@ -0,0 +1,2 @@
+export * from "./GitHubWidget";
+export * from "./GiteaWidget";
diff --git a/src/styles/widget.css b/src/styles/GitHubWidget.css
similarity index 79%
rename from src/styles/widget.css
rename to src/styles/GitHubWidget.css
index 982e59e..0b03e6b 100644
--- a/src/styles/widget.css
+++ b/src/styles/GitHubWidget.css
@@ -6,7 +6,7 @@
   margin: 0 auto;
 }
 
-.widget-header {
+.github-widget-header {
   display: flex;
   align-items: center;
   padding: 16px;
@@ -19,19 +19,19 @@
   font-size: 20px;
 }
 
-.widget-header h3 {
+.github-widget-header h3 {
   margin: 0;
   flex-grow: 1;
   font-size: 14px;
   font-weight: 600;
 }
 
-.repo-form {
+.github-repo-form {
   display: flex;
   gap: 8px;
 }
 
-.repo-input {
+.github-repo-input {
   padding: 4px 8px;
   border: 1px solid #d1d5da;
   border-radius: 3px;
@@ -39,7 +39,7 @@
   width: 120px;
 }
 
-.refresh-btn {
+.github-refresh-btn {
   background: #2ea44f;
   color: white;
   border: none;
@@ -50,7 +50,7 @@
   align-items: center;
 }
 
-.widget-body {
+.github-widget-body {
   padding: 16px;
 }
 
@@ -63,14 +63,14 @@
   border-bottom: none;
 }
 
-.commit-header {
+.github-commit-header {
   display: flex;
   justify-content: space-between;
   margin-bottom: 8px;
   font-size: 12px;
 }
 
-.commit-sha {
+.github-commit-sha {
   color: #0366d6;
   text-decoration: none;
   display: flex;
@@ -78,62 +78,62 @@
   gap: 4px;
 }
 
-.commit-time {
+.github-commit-time {
   color: #6a737d;
   display: flex;
   align-items: center;
   gap: 4px;
 }
 
-.commit-message {
+.github-commit-message {
   margin-bottom: 8px;
   font-size: 14px;
 }
 
-.commit-author {
+.github-commit-author {
   display: flex;
   align-items: center;
   gap: 8px;
   font-size: 12px;
 }
 
-.author-avatar {
+.github-author-avatar {
   width: 20px;
   height: 20px;
   border-radius: 50%;
 }
 
-.author-name {
+.github-author-name {
   color: #586069;
   display: flex;
   align-items: center;
   gap: 4px;
 }
 
-.loading,
-.error,
-.no-commits {
+.github-loading,
+.github-error,
+.github-no-commits {
   text-align: center;
   padding: 20px;
   color: #586069;
 }
 
-.error {
+.github-error {
   color: #cb2431;
 }
 
-.widget-footer {
+.github-widget-footer {
   padding: 12px 16px;
   border-top: 1px solid #e1e4e8;
   text-align: center;
 }
 
-.view-all {
+.github-view-all {
   color: #0366d6;
   text-decoration: none;
   font-size: 12px;
 }
 
-.view-all:hover {
+.github-view-all:hover {
   text-decoration: underline;
 }
diff --git a/src/styles/GiteaWidget.css b/src/styles/GiteaWidget.css
new file mode 100644
index 0000000..4b0fda6
--- /dev/null
+++ b/src/styles/GiteaWidget.css
@@ -0,0 +1,324 @@
+/* components/GiteaWidget/GiteaWidget.css */
+.gitea-widget {
+  background: #f8fafc;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  max-width: 600px;
+  margin: 0 auto;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.widget-header {
+  display: flex;
+  align-items: center;
+  padding: 16px;
+  border-bottom: 1px solid #d1d9e0;
+  background: linear-gradient(135deg, #609926 0%, #467f1c 100%);
+  color: white;
+}
+
+.gitea-icon {
+  margin-right: 12px;
+  font-size: 24px;
+}
+
+.widget-header h3 {
+  margin: 0;
+  flex-grow: 1;
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.advanced-toggle {
+  background: rgba(255, 255, 255, 0.2);
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  color: white;
+  border-radius: 4px;
+  padding: 6px 12px;
+  font-size: 12px;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+.advanced-toggle:hover {
+  background: rgba(255, 255, 255, 0.3);
+}
+
+.config-form {
+  padding: 16px;
+  background: white;
+  border-bottom: 1px solid #eaecef;
+}
+
+.form-group {
+  margin-bottom: 16px;
+}
+
+.form-group label {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-bottom: 8px;
+  font-size: 14px;
+  font-weight: 500;
+  color: #2d3748;
+}
+
+.url-input,
+.repo-input {
+  width: 100%;
+  padding: 8px 12px;
+  border: 1px solid #cbd5e0;
+  border-radius: 4px;
+  font-size: 14px;
+}
+
+.url-input:focus,
+.repo-input:focus {
+  outline: none;
+  border-color: #609926;
+  box-shadow: 0 0 0 3px rgba(96, 153, 38, 0.1);
+}
+
+.preset-repos {
+  display: flex;
+  gap: 8px;
+  margin-top: 8px;
+  flex-wrap: wrap;
+}
+
+.preset-btn {
+  background: #edf2f7;
+  border: 1px solid #cbd5e0;
+  border-radius: 4px;
+  padding: 4px 8px;
+  font-size: 12px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.preset-btn:hover {
+  background: #e2e8f0;
+  border-color: #a0aec0;
+}
+
+.simple-form {
+  padding: 12px 16px;
+  background: white;
+  border-bottom: 1px solid #eaecef;
+}
+
+.input-group {
+  display: flex;
+  gap: 8px;
+}
+
+.simple-input {
+  flex-grow: 1;
+  padding: 8px 12px;
+  border: 1px solid #cbd5e0;
+  border-radius: 4px;
+  font-size: 14px;
+}
+
+.simple-btn {
+  background: #609926;
+  color: white;
+  border: none;
+  border-radius: 4px;
+  padding: 8px 16px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.current-config {
+  padding: 8px 16px;
+  background: #f1f5f9;
+  border-bottom: 1px solid #e2e8f0;
+  font-size: 12px;
+  color: #64748b;
+}
+
+.current-config code {
+  background: #e2e8f0;
+  padding: 2px 4px;
+  border-radius: 2px;
+  margin: 0 2px;
+}
+
+.widget-body {
+  padding: 0;
+}
+
+.gitea-commit-item {
+  padding: 16px;
+  border-bottom: 1px solid #eaecef;
+  background: white;
+  transition: background 0.2s;
+}
+
+.gitea-commit-item:hover {
+  background: #f8fafc;
+}
+
+.gitea-commit-item:last-child {
+  border-bottom: none;
+}
+
+.commit-header {
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 8px;
+  font-size: 12px;
+}
+
+.commit-sha {
+  color: #609926;
+  text-decoration: none;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-weight: 500;
+}
+
+.commit-time {
+  color: #718096;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.commit-message {
+  margin-bottom: 12px;
+  font-size: 14px;
+  line-height: 1.5;
+  color: #2d3748;
+}
+
+.commit-author {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 12px;
+}
+
+.author-avatar {
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  object-fit: cover;
+}
+
+.author-name {
+  color: #4a5568;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.loading {
+  padding: 40px 20px;
+  text-align: center;
+  color: #718096;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12px;
+}
+
+.spinner {
+  width: 40px;
+  height: 40px;
+  border: 3px solid #e2e8f0;
+  border-top: 3px solid #609926;
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+.error {
+  padding: 24px;
+  text-align: center;
+  color: #e53e3e;
+}
+
+.error-details {
+  margin-top: 12px;
+}
+
+.error-details small {
+  color: #718096;
+  display: block;
+  margin: 8px 0;
+}
+
+.help-text {
+  text-align: left;
+  margin-top: 16px;
+  color: #4a5568;
+  font-size: 12px;
+}
+
+.help-text ul {
+  margin: 8px 0;
+  padding-left: 20px;
+}
+
+.no-commits {
+  padding: 40px 20px;
+  text-align: center;
+  color: #a0aec0;
+  font-style: italic;
+}
+
+.widget-footer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px 16px;
+  border-top: 1px solid #e2e8f0;
+  background: white;
+}
+
+.view-all {
+  color: #609926;
+  text-decoration: none;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.view-all:hover {
+  text-decoration: underline;
+}
+
+.commit-count {
+  color: #718096;
+  font-size: 12px;
+}
+
+.refresh-btn {
+  background: #609926;
+  color: white;
+  border: none;
+  border-radius: 4px;
+  padding: 10px 20px;
+  font-size: 14px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  transition: background 0.2s;
+}
+
+.refresh-btn:hover {
+  background: #4d7c1f;
+}
diff --git a/src/styles/index.css b/src/styles/index.css
index fd03978..2816721 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -3,7 +3,7 @@
 @import "tailwindcss/components";
 @import "tailwindcss/utilities"; */
 
-@import "./widget.css";
+
 
 :root {
   font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
diff --git a/src/utils/giteaApi.ts b/src/utils/giteaApi.ts
new file mode 100644
index 0000000..1d946c2
--- /dev/null
+++ b/src/utils/giteaApi.ts
@@ -0,0 +1,77 @@
+import axios from 'axios';
+
+// Gitea API configuration
+
+const createGiteaApi = (baseUrl, token = null) => {
+  const headers = {
+    'Content-Type': 'application/json',
+  };
+
+  if (token) {
+    headers.Authorization = `token ${token}`;
+  }
+
+  const api = axios.create({
+    baseURL: `${baseUrl}/api/v1`,
+    headers,
+  });
+
+  return {
+    // Fetch commits for a repository
+    fetchCommits: async (owner, repo, limit = 10, branch = 'main') => {
+      try {
+        const response = await api.get(
+          `/repos/${owner}/${repo}/commits`,
+          {
+            params: {
+              limit,
+              page: 1,
+              sha: branch, // Optional branch parameter
+            }
+          }
+        );
+        return response.data;
+      } catch (error) {
+        console.error('Error fetching Gitea commits:', error);
+        throw error;
+      }
+    },
+
+    // Fetch user repositories
+    fetchUserRepos: async (username) => {
+      try {
+        const response = await api.get(`/users/${username}/repos`);
+        return response.data;
+      } catch (error) {
+        console.error('Error fetching user repos:', error);
+        throw error;
+      }
+    },
+
+    // Fetch repository information
+    fetchRepoInfo: async (owner, repo) => {
+      try {
+        const response = await api.get(`/repos/${owner}/${repo}`);
+        return response.data;
+      } catch (error) {
+        console.error('Error fetching repo info:', error);
+        throw error;
+      }
+    },
+
+    // Search repositories
+    searchRepos: async (query) => {
+      try {
+        const response = await api.get('/repos/search', {
+          params: { q: query, limit: 10 }
+        });
+        return response.data.data;
+      } catch (error) {
+        console.error('Error searching repos:', error);
+        throw error;
+      }
+    }
+  };
+};
+
+export default createGiteaApi;
\ No newline at end of file
diff --git a/src/utils/githubApi.ts b/src/utils/githubApi.ts
index 5dbbf1d..a5fa21f 100644
--- a/src/utils/githubApi.ts
+++ b/src/utils/githubApi.ts
@@ -1,11 +1,11 @@
 // utils/githubApi.js
-import axios from 'axios';
+import axios from "axios";
 
-const GITHUB_API = 'https://api.github.com';
+const GITHUB_API = "https://api.github.com";
 
 export const fetchCommits = async (repo, token = null, limit = 10) => {
-  const [owner, repoName] = repo.split('/');
-  
+  const [owner, repoName] = repo.split("/");
+
   const headers = {};
   if (token) {
     headers.Authorization = `token ${token}`;
@@ -18,14 +18,14 @@ export const fetchCommits = async (repo, token = null, limit = 10) => {
         headers,
         params: {
           per_page: limit,
-          page: 1
-        }
+          page: 1,
+        },
       }
     );
-    
+
     return response.data;
   } catch (error) {
-    console.error('Error fetching GitHub commits:', error);
+    console.error("Error fetching GitHub commits:", error);
     throw error;
   }
 };
@@ -37,13 +37,12 @@ export const fetchUserRepos = async (username, token = null) => {
   }
 
   try {
-    const response = await axios.get(
-      `${GITHUB_API}/users/${username}/repos`,
-      { headers }
-    );
+    const response = await axios.get(`${GITHUB_API}/users/${username}/repos`, {
+      headers,
+    });
     return response.data;
   } catch (error) {
-    console.error('Error fetching user repos:', error);
+    console.error("Error fetching user repos:", error);
     throw error;
   }
-};
\ No newline at end of file
+};