Saracodesagain.github.io/index.html at main · Saracodesagain/Saracodesagain.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Sara — Cybersecurity Portfolio</title>
  <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;600&display=swap" rel="stylesheet">
  <style>
    :root {
      --pink-bg: #fdf2f8;
      --pink-accent: #e91e63;
      --text-color: #333;
    }

    body {
      margin: 0;
      padding: 0;
      background-color: var(--pink-bg);
      font-family: 'Outfit', sans-serif;
      color: var(--text-color);
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      min-height: 100vh;
      padding: 40px 20px;
    }

    h1 {
      font-size: 2.8rem;
      margin-bottom: 10px;
      color: var(--pink-accent);
    }

    p {
      font-size: 1.1rem;
      max-width: 600px;
      margin-bottom: 30px;
    }

    .links {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 15px;
    }

    .links a {
      text-decoration: none;
      padding: 10px 20px;
      border-radius: 30px;
      background-color: var(--pink-accent);
      color: white;
      font-weight: 600;
      transition: background 0.3s ease;
    }

    .links a:hover {
      background-color: #c2185b;
    }

    footer {
      margin-top: auto;
      font-size: 0.85rem;
      color: #888;
      padding-top: 60px;
    }
  </style>
</head>
<body>

  <h1>Hello, I’m Sara 👋</h1>
  <p>
    I want to build many cybersecurity tools and projects to help myself and maybe even other defenders learn, detect, and stay one step ahead.
    Explore my work, or get in touch below.
  </p>

  <div class="links">
    <a href="https://github.com/saracodesagain" target="_blank">GitHub</a>
  </div>

  <footer>
    &copy; 2025 Sara — Powered by GitHub Pages
  </footer>

</body>
</html>