diff --git a/app/Header.tsx b/app/Header.tsx index 96721bd..2a1c9d0 100644 --- a/app/Header.tsx +++ b/app/Header.tsx @@ -1,6 +1,5 @@ // Header.tsx import React from 'react'; -import Login from './Login'; interface HeaderProps { onViewChange: (view: 'AI' | 'FAQ' | 'Documentation') => void; @@ -12,31 +11,28 @@ interface HeaderProps { const Header: React.FC = ({ onViewChange, showDivs, toggleDivs, showHistoryModelsToggle, showToggle }) => { return ( - <> -
- +
); }; diff --git a/app/Login.tsx b/app/Login.tsx deleted file mode 100644 index c37a1fa..0000000 --- a/app/Login.tsx +++ /dev/null @@ -1,138 +0,0 @@ -import React, { useState } from 'react'; -import Settings from './Settings'; // Import the Settings component - -const Login: React.FC = () => { - // State to handle popup visibility - const [showPopup, setShowPopup] = useState(false); - const [showSignInPopup, setShowSignInPopup] = useState(false); - const [isLoggedIn, setIsLoggedIn] = useState(false); - const [showSettingsPopup, setShowSettingsPopup] = useState(false); - - // Credentials state - const [email, setEmail] = useState(''); - const [password, setPassword] = useState(''); - const [accountName, setAccountName] = useState('Pluto'); // Set the account name - - // Function to toggle the popup - const togglePopup = () => setShowPopup(!showPopup); - - // Function to toggle the sign-in popup - const toggleSignInPopup = () => { - setShowSignInPopup(!showSignInPopup); - setShowPopup(false); // Hide login popup when opening the sign-in popup - }; - - // Function to handle login - const handleLogin = () => { - if ((email === 'pluto@imareal.planet' || accountName === 'Pluto') && password === 'fuckTheSun1234') { - setIsLoggedIn(true); // Successful login - setShowSignInPopup(false); // Close the sign-in popup - } else { - alert('Incorrect credentials'); - } - }; - - // Function to toggle the settings popup - const toggleSettingsPopup = () => setShowSettingsPopup(!showSettingsPopup); - - return ( -
- {/* Login or Settings Button */} -
- -
- - {/* Conditional rendering of the initial Popup */} - {showPopup && ( -
-
-

Register

- - {/* Name or Email Input */} -
- setEmail(e.target.value)} - /> -
- - {/* Password Input (displayed as asterisks) */} -
- setPassword(e.target.value)} - /> -
- - {/* Create Account and Sign In buttons */} -
- -

- Already have an account? Sign in {' '} - - here - -

-
- - {/* Close Button */} - -
-
- )} - - {/* Conditional rendering of the Sign-In Popup */} - {showSignInPopup && ( -
-
-

Sign In

- - {/* Name or Email Input */} -
- setEmail(e.target.value)} - /> -
- - {/* Password Input (displayed as asterisks) */} -
- setPassword(e.target.value)} - /> -
- - {/* Log In Button */} -
- -
- - {/* Close Button */} - -
-
- )} - - {/* Conditional rendering of the Settings Popup */} - {showSettingsPopup && } -
- ); -}; - -export default Login; diff --git a/app/Settings.tsx b/app/Settings.tsx deleted file mode 100644 index 697fb68..0000000 --- a/app/Settings.tsx +++ /dev/null @@ -1,244 +0,0 @@ -import React, { useState } from'react'; - -const Settings: React.FC<{ closeSettings: () => void; accountName: string }> = ({ closeSettings, accountName }) => { - const [activeSection, setActiveSection] = useState('general'); - - const renderSettingsContent = () => { - switch (activeSection) { - case 'general': - return ( -
-

General Settings

-
-

Change Language

- -
-
-

Notifications

- -
-
-

Notification Frequency

- -
-
-

Time Zone

- -
-
-

Auto-Save

- -
-
-

Auto-Save Frequency

- -
-
-

Default Currency

- -
-
-

Date Format

- -
-
-

Time Format

- -
-
- ); - case 'privacy': - return ( -
-

Privacy Settings

-
-

Data Collection

- -
-
-

Location Access

- -
-
-

Two-Factor Authentication

- -
-
-

Data Export

- -
-
-

Cookie Policy

- -
-
-

GDPR Compliance

- -
-
-

CCPA Compliance

- -
-
-

Biometric Data

- -
-
- ); - case 'theme': - return ( -
-

Theme Settings

-
-

Choose Theme Color

- -
-
-

Font Size

- -
-
-

Background Pattern

- -
-
-

Font Family

- -
-
-

Button Style

- -
-
- ); - case 'account': - return ( -
-

Account Settings

-
-

Change Name

- -
-
-

Change Email

- -
-
-

Change Password

- -
-
-

Delete Account

- -
-
- ); - default: - return null; - } - }; - - return ( -
-
-
-
-
    -
  • setActiveSection('general')}>General
  • -
  • setActiveSection('privacy')}>Privacy
  • -
  • setActiveSection('theme')}>Theme
  • -
  • setActiveSection('account')}>Account
  • -
-
-
-

Settings for {accountName}

- {renderSettingsContent()} - -
-
-
-
- ); -}; - -export default Settings; \ No newline at end of file diff --git a/app/styles/Login.css b/app/styles/Login.css deleted file mode 100644 index c2754a9..0000000 --- a/app/styles/Login.css +++ /dev/null @@ -1,116 +0,0 @@ -.login-button { - position: absolute; - top: 5px; - right: 10px; - z-index: 9999; /* Highest z-index for the login button */ - margin: 1px; -} - -.login-button button { - padding: 10px 20px; - background-color: var(--input-button-color); - color: var(--text-color); - border: none; - border-radius: 5px; - cursor: pointer; - transition: background-color 0.3s; -} - -.login-button button:hover { - background-color: var(--input-button-hover-color); -} - -/* Overlay for popup - full screen and centered */ -.popup-overlay { - position: fixed; /* Fixed to cover the entire viewport */ - top: 0; /* Ensure it starts from the top */ - left: 0; - width: 100%; - height: 100%; - background: rgba(0, 0, 0, 0.7); - display: flex; - justify-content: center; - align-items: center; - z-index: 10000; /* Higher than the header to cover the screen */ -} - -/* Popup content box */ -.popup-content { - background: var(--background-color); - color: var(--text-color); - padding: 30px; - border-radius: 10px; - width: 300px; - text-align: center; - box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); -} - -/* Input styles */ -.popup-content input { - width: 100%; - padding: 10px; - margin: 10px 0; - border: 1px solid var(--input-border-color); - border-radius: 5px; - font-size: 16px; - transition: border-color 0.3s; -} - -.popup-content input:focus { - border-color: var(--input-button-color); - outline: none; /* Remove default outline */ -} - -/* Close button */ -.close-popup { - background: red; /* Exception to the rule */ - color: var(--text-color); - border: none; - border-radius: 5px; - padding: 5px 10px; - cursor: pointer; - margin-top: 20px; -} - -.log-into-account { - background: green; /* Exception to the rule */ - color: var(--text-color); - border: none; - border-radius: 5px; - padding: 5px 10px; - cursor: pointer; - margin-top: 20px; -} - -/* Footer section */ -.popup-footer { - margin-top: 15px; -} - -.popup-footer button { - margin-right: 10px; - padding: 8px 15px; - background-color: var(--input-button-color); - color: var(--text-color); - border: none; - border-radius: 5px; - transition: background-color 0.3s; -} - -.popup-footer button:hover { - background-color: var(--input-button-hover-color); -} - -.popup-footer a { - color: var(--user-message-color); - text-decoration: none; -} - -.popup-footer a:hover { - text-decoration: underline; -} - -.popup-content p { - color: var(--pop-up-text); - margin: 10px; -} diff --git a/app/styles/Settings.css b/app/styles/Settings.css deleted file mode 100644 index ff74100..0000000 --- a/app/styles/Settings.css +++ /dev/null @@ -1,113 +0,0 @@ -/* Overlay for popup - full screen and centered */ -.popup-overlay { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: rgba(0, 0, 0, 0.7); - display: flex; - justify-content: center; - align-items: center; - z-index: 10000; -} - -/* Settings content */ -.settings-content { - background: #f5f5f5; - color: #333; - padding: 20px; - border-radius: 10px; - width: 90%; - max-width: 800px; - height: 90%; - max-height: 600px; - display: grid; - grid-template-columns: 1fr 3fr; /* 1fr for sidebar, 3fr for main content */ - grid-auto-flow: column; - box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); - overflow: scroll; /* Prevents overflow of the content */ - position: relative; /* Needed for absolute positioning of close button */ -} - -/* Sidebar styles */ -.sidebar { - background: #e0e0e0; - padding: 20px; - border-radius: 10px 0 0 10px; /* Rounded corners on the left side */ - box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); - overflow-y: auto; /* Scroll if content exceeds height */ - display: flex; - flex-direction: column; - grid-column: 1; /* Places sidebar in the first grid column */ -} - -/* Sidebar item styles */ -.sidebar ul { - list-style-type: none; - padding: 0; - margin: 0; /* Ensure no margin for the list */ - display: flex; - flex-direction: column; /* Make the ul a column */ -} - -.sidebar li { - margin: 10px 0; - cursor: pointer; - padding: 10px; - border-radius: 5px; - transition: background 0.3s; -} - -.sidebar li:hover { - background: #d0d0d0; /* Highlight on hover */ -} - -.sidebar li.active { - background: #b0b0b0; /* Active section highlight */ -} - -/* Main settings area */ -.settings-main { - grid-column: 2; /* Places main settings in the second grid column */ - padding: 20px; - border-radius: 0 10px 10px 0; /* Rounded corners on the right side */ - overflow-y: auto; /* Scroll if content exceeds height */ - display: flex; /* Ensure main settings area displays content correctly */ - flex-direction: column; /* Stack content vertically */ -} - -/* Close button positioning */ -.close-popup { - background-color: #ff4d4d; - color: #fff; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); - padding: 10px 20px; - border: none; - border-radius: 5px; - cursor: pointer; - position: absolute; /* Position absolute to top right */ - top: 20px; /* Distance from top */ - right: 20px; /* Distance from right */ - transition: background 0.3s; -} - -.close-popup:hover { - background-color: #e63939; /* Darker red on hover */ -} - -/* Additional styles for inputs and options */ -.settings-option input[type="text"], -.settings-option input[type="email"], -.settings-option input[type="password"], -.settings-option input[type="color"], -.settings-option input[type="range"], -.settings-option select { - border-color: #ccc; - color: #333; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); - padding: 10px; - border-radius: 5px; - width: 100%; - margin-bottom: 10px; /* Add spacing between inputs */ -} diff --git a/app/styles/master.css b/app/styles/master.css index 73edf95..53fcff8 100644 --- a/app/styles/master.css +++ b/app/styles/master.css @@ -12,6 +12,4 @@ @import './faq.css'; @import './scrollbar.css'; @import './doc.css'; -@import './Login.css'; -@import './Settings.css'; @import './responsive.css'; diff --git a/app/styles/responsive.css b/app/styles/responsive.css index b995946..1a66c07 100644 --- a/app/styles/responsive.css +++ b/app/styles/responsive.css @@ -107,20 +107,4 @@ font-size: 1.2em; /* Adjust button font size */ margin: auto; } -} - - -/* Responsive adjustments for the settings*/ -@media (max-width: 768px) { - .settings-content { - flex-direction: column; /* Stack sidebar and main content on smaller screens */ - } - - .sidebar { - width: 100%; /* Full width for sidebar */ - } - - .settings-main { - width: 100%; /* Full width for main content */ - } } \ No newline at end of file diff --git a/app/styles/variables.css b/app/styles/variables.css index 97b3628..3df7f30 100644 --- a/app/styles/variables.css +++ b/app/styles/variables.css @@ -12,5 +12,4 @@ --input-button-hover-color: rgb(0, 100, 200); --scrollbar-track: rgb(91, 172, 253); --scrollbar-thumb: rgb(0, 88, 176); - --pop-up-text: darkgrey; }