www/index.html


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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="generator"
        content="HTML Tidy for HTML5 for Linux version 5.7.45">
  <title>The Woman in my Eye</title>
  <link rel="icon"
        href="favicon.ico">
  <link rel="license"
        href="#license">
  <meta name="viewport"
        content="width=device-width, initial-scale=1">
  <meta name="description"
        content=
        "The woman in your eye is a transgender blog from the perspective of the author. She tries her best to provide information to hopefully help or entertain her readers who may also be struggling with their gender identity">

  <style>
    :root {
        --twhite: #fff;
        --tblue: #4ac2fe;
        --tpink: #ef95ae;
        --flagheight: 60px;
        --flagwidth: 90px;
        --bgcolor: #e4e4ff;
    }
    html, body {
        margin: 16px;
        line-height: 1.5em;
        background-color: var(--bgcolor);
    }
    p { margin: 0; }
    header {
        text-align: center;
        margin: 32px 0;
    }
    nav > a {
        padding: 4px;
    }
    footer {
        display: flex;
        justify-content: center;
        font-size: 0.9em;
    }
    article {
        background-color: white;
        padding: 16px;
    }
    .content article {
        margin: auto auto;
        max-width: 1000px;
        border-radius: 8px;
        margin-bottom: 32px;
    }
    .content article:last-child {
        margin-bottom: none;
    }

    .transflag {
        width: var(--flagwidth);
        height: var(--flagheight);
        margin: 16px auto;
    }
    .transflag .blue {
        width: 100%;
        min-height: calc(var(--flagheight) / 5);
        background-color: var(--tblue);
    }
    .transflag .pink {
        width: 100%;
        min-height: calc(var(--flagheight) / 5);
        background-color: var(--tpink);
    }
    .transflag .white {
        width: 100%;
        min-height: calc(var(--flagheight) / 5);
        background-color: var(--twhite);
    }
  </style>
</head>
<body>
  <header>
    <h1>Hello,</h1>
    <h1>The Woman in my Eye</h1>
    <nav>
      <a href='/bio'>bio</a> <a href='/resources'>resources</a> <a href=
      '/blogs'>blog</a>
    </nav>
  </header>
  <section class='content'>
    <article>
      <p>Welcome to my blog. My name is Steph and I am a 30 something
      transgender woman. This blog focuses on my journey transitioning and
      discovering my gender. I am not a medical professional or an expert on
      the subject. I am simply a girl trying to share her story in the hopes it
      might actually help someone else find themselves...or entertain; either
      works!</p>
    </article>
    <article>
      <p>This would be where my first article would be... if I didn&#39;t just
      start this site! Please look forward to it.</p>
    </article>
  </section>
  <section>
    <div class='transflag'>
      <div class='blue'></div>
      <div class='pink'></div>
      <div class='white'></div>
      <div class='pink'></div>
      <div class='blue'></div>
    </div>
  </section>
  <footer>
    <p>© 2023 thewomaninmyeye dot org - <a id="license"
       rel="license external noopener noreferrer"
       target="_blank"
       href="https://creativecommons.org/licenses/by/4.0/">CC BY-SA 4.0</a>
       unless otherwise noted.</p>
  </footer>
</body>
</html>