Changed button layout, IRC button removed but not been placed back yet

Redesign of passwordgen page
2025-04-01 20:23:44 +02:00 · 2021-03-09 00:28:22 +01:00 · 2021-03-09 00:28:22 +01:00 · ca9be0f3c3
commit ca9be0f3c3
parent 28363c3721
7 changed files with 92 additions and 73 deletions
--- a/src/components/layout.js
+++ b/src/components/layout.js
@ -104,17 +104,6 @@ export default function Layout({
                  </Link>
                )
              })}
-              <a
-                href={`/dataeditor`}
-                onClick={closeSideBar}
-                target="_blank"
-                rel="noreferrer"
-                title={
-                  'Kérdések szerkesztése, törlése, beküldése, és kitöltetlen tesztek'
-                }
-              >
-                Kérdés szerkesztő
-              </a>
              <a
                href={`/donate`}
                className="donate"
--- a/src/data/tabs.json
+++ b/src/data/tabs.json
@ -3,10 +3,6 @@
    "href": "/",
    "text": "Főoldal"
  },
-  "manual": {
-    "href": "/manual",
-    "text": "A script használata"
-  },
  "allQuestions": {
    "href": "/allQuestions",
    "text": "Kérdések és tárgyak"
--- a/src/defaultStyles.css
+++ b/src/defaultStyles.css
@ -167,6 +167,7 @@ a:hover {
  .rtfmImage {
    display: flex;
    justify-content: center;
+    border: 2px solid white;
    width: 100%;
  }

@ -282,6 +283,7 @@ a:hover {
 .pageHeader h1 {
  padding-top: 6px;
  letter-spacing: 7px;
+  text-align: center;
  margin: 0px;
 }

@ -302,7 +304,7 @@ select {
 }

 select:hover {
-  border: 1px solid #99f;
+  border: 1px solid #F2CB05;
 }

 .userStatus {
--- a/src/pages/index.js
+++ b/src/pages/index.js
@ -15,9 +15,13 @@ const links = {
    href: '/install',
    text: 'Install',
  },
-  irc: {
-    href: '/irc',
-    text: 'IRC chat',
+  manual: {
+    href: '/manual',
+    text: 'A script használata',
+    },
+  dataeditor: {
+    href: '/dataeditor',
+    text: 'Kérdés szerkesztő',
  },
 }

@ -192,13 +196,14 @@ export default function Index(props) {
        >
          {'Összes kérdés TXT'}
        </a>
+        
        <a
-          onClick={() => {
+          /*onClick={() => {
            setAllQrSelector('json')
          }}
-          className={styles.button}
+          className={styles.button}*/
        >
-          {'Összes kérdés JSON'}
+          {/*'Összes kérdés JSON'*/}
        </a>
      </div>
      {renderMotd()}
--- a/src/pages/manual.js
+++ b/src/pages/manual.js
@ -109,7 +109,7 @@ function renderMaual() {
      </div>
      <hr />
      <center>
-        <h2 className={'subtitle'}>Jelszavak</h2>
+        <h2 id="pw" className={'subtitle'}>Jelszavak</h2>
      </center>
      <div className={'manualBody'}>
      <p>Ha ezt olvasod valszeg már neked is van. Azért lett bevezetve, hogy
--- a/src/pages/pwRequest.js
+++ b/src/pages/pwRequest.js
@ -67,48 +67,54 @@ export default function PwRequest(props) {
          }
        })
        .catch((e) => {
-          setResult([...result, 'Szerver oldali hiba!'])
+          setResult([...result, 'Szerver oldali hiba! :('])
          console.error(e)
        })
    } catch (e) {
-      setResult([...result, 'Szerver oldali hiba!'])
+      setResult([...result, 'Szerver oldali hiba! :('])
      console.error(e)
    }
  }
+    /*removed: Az új felhasználóknak
+               <span>{' ' + daysAfterUserGetsPWs + ' '}</span>
+               napot kell várniuk, míg jelszó generálási lehetőséget kapnak.< br />*/

  return (
-    // TODO: újrafogalmazás, remove hány nap után kapnak új jelszót először
+    // TODO: a generált jelszó modal-on való megjelenítésének kivitelezése.
+    // TODO: <span>{' ' + createDate}</span>-kor. rész után az oldal összes jelenlegi 
+        //felhasználójának darabszámának megjelenítése.
    <div>
      <Head>
-        <title>Jelszó kérés - Qmining | Frylabs.net</title>
+        <title>Jelszó generálás - Qmining | Frylabs.net</title>
      </Head>
+      <div className={'pageHeader'}>
+        <h1 className={'pageHeader h1'}>Jelszó generálás</h1>
+      </div>
      <div id="form">
        <div className={styles.text}>
-          Itt új jelszavakat tudsz kérni új felhasználóknak. Közös
-          jelszóhasználat nem ajánlott, mert ha valaki belép azzal a jelszóval
-          amit te használsz akkor téged kiléptet mindenhonnan. Szerintem van
-          elég jelszó hogy ne kelljen közös
+          <p className={styles.descrip}>Ezen az oldalon lehetőséged van lekérni jelszavakat, 
+          hogy új felhasználókat hívhass meg az oldalra, vagy elfelejtett jelszavadat pótold, 
+          amennyiben még be vagy jelentkezve a régivel. (Konkrét elfelejtett jelszó funkció még nincsen)<br />
+          Minden felhasználó saját és különböző jelszót kap. Inkább generálj egyet és add oda másnak,
+          mint hogy közösen használjatok egyet, mert egyszerre, egy felhasználó csak egy helyen, egy 
+          eszközön lehet belépve, mindenhol máshol automatikusan kijelentkeztetésre kerül. A jelszavakról
+          bővebben a Script használata oldal <a href="/manual#pw" target="_blank">vonatkozó részén</a> olvashatsz.</p>
        </div>
        <div className={styles.text}>
-          Új felhasználóknak
-          <span>{' ' + daysAfterUserGetsPWs + ' '}</span>
-          napot kell várni, míg kapnak lehetőséget jelszó generálásra.
-        </div>
-        <div className={styles.text}>
-          <span>{' ' + addPwPerDay + ' '}</span>
-          naponta
+          Egy felhasználó egyszerre 
          <span>{' ' + addPWCount + ' '}</span>
-          új lehetőség van jelszót generálni, maximum
+          jelszót generálhat, a jelszókérések közt
+          <span>{' ' + addPwPerDay + ' '}</span>
+          napnak kell eltelnie, hogy újabb jelszót kérhess le.<br />
+          Egy felhasználó összesen
          <span>{' ' + maxPWCount + ' '}</span>
-          lehetőség gyűlhet össze
-        </div>
-        <div className={styles.text}>
-          Még kérhető jelszavak:
-          <span>{' ' + remaining}</span>. Felhasználó létrehozva:
-          <span>{' ' + createDate}</span>,<span>{' ' + dayDiff + ' '}</span>
-          napja. Eddig
+          jelszót generálhat.<br />          
+          Ebből eddig
          <span>{' ' + requestedPWS + ' '}</span>
-          jelszót kértél.
+          lehetőséget használtál fel, tehát még
+          <span>{' ' + remaining}</span> db jelszót kérhetsz le. <br /><br /> A jelenleg bejelentkezett 
+          felhasználó létrehozva:
+          <span>{' ' + dayDiff}</span> napja,<span>{' ' + createDate}</span>-kor.<br /><br />
        </div>
        <div className={styles.buttonContainer}>
          <div onClick={handleSubmit} className={styles.button}>
--- a/src/pages/pwRequest.module.css
+++ b/src/pages/pwRequest.module.css
@ -6,13 +6,26 @@
 }

 .button {
-  cursor: pointer;
-  text-align: center;
-  background-color: var(--text-color);
+  background-color: #F2CB05;
  border: none;
-  padding: 10px 30px;
-  color: white;
-  width: 200px;
+  color: black;
+  padding: 15px 30px;
+  font-weight: bold;
+  font-size: 15px;
+  margin: 8px 2px 2px 2px;
+  cursor: pointer;
+  text-shadow: 1px 1px 8px black;
+  transition: width 0.5s, height 0.5s, ease-in 0.5s;
+}
+
+.button:active {
+  transform: translateY(2.5px);
+}
+
+.button:hover {
+  text-shadow: 2px 2px 8px black;
+  transition: width 0.5s, height 0.5s, ease-out 0.5s;
+  background-color: #a38c1a;
 }

 .text {
@ -22,6 +35,14 @@
  padding: 10px;
 }

+.descrip {
+  color: #acabab;
+  font-weight: bold;
+  padding-top: 4%;
+  padding-bottom: 4%;
+  font-size: 20px;
+}
+
 .pw {
  margin: 10px;
 }