jackverstappen.github.io/index.html at master · jackverstappen/jackverstappen.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
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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<!doctype html>
<html lang="en">
  <head>
    <title>(} digitizedbeing</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="robots" content="all">
    <base href="/">
    <style>
      @import url('https://fonts.googleapis.com/css2?family=Encode+Sans+Condensed:wght@100;200;300;400;500;600;700;800;900&display=swap');
      @import url("https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap");

      :root {
        /* Typography */
        --sans-serif:    'Encode Sans Condensed', sans-serif;
        --serif:         'Spectral, serif';
        --font-size-s:   0.85rem;
        --font-size-l:   clamp(1.25rem, 3vw, 1.75rem);
        --font-size-xl:  clamp(1.5rem, 5vw, 2.75rem);

        font-family: var(--sans-serif);


        font-size: 1rem;

        /* Primitive tokens */
        --color-text:         #000;
        --color-text-alt:     #6a6a6a;
        --color-faded:        #c9c9c9;
        --color-bg:           #fff;
        --border-color:       #ccc;
        --color-link:         #000;
        --color-link-hover:   #999;
        --color-placeholder:  #f8f8f8;

        /* Semantic tokens — used in WorkHeader, Gallery */
        --color-text-primary:          #000;
        --color-text-secondary:        #6a6a6a;
        --color-background-primary:    #f4f4f4;
        --color-background-secondary:  #ebebeb;
        --color-border-secondary:      #000;
        --color-border-tertiary:       rgba(0, 0, 0, 0.1);
        --color-border-info:           #378add;

        /* Spacing / shape tokens */
        --border-radius-sm: 4px;
        --border-radius-md: 6px;
        --border-radius-lg: 12px;

      }

      h1 {
        text-align:right;
        margin-block:8rem;
        font-weight: 400;
        font-size:xx-large;
      }

      blockquote {
        padding: 1rem;
        min-width:12rem;
        padding-left: 2rem;
        position: relative;
        overflow: hidden;
        background-color: #f0f0f0;
        font-style:italic;
        font-size: 1.2rem;
        font-family: var(--serif);
        border: solid 2px #0001;
        border-radius: .5rem;
        box-shadow: .5rem .5rem 1rem gray;
      }
      blockquote::before,
      blockquote::after{
          position: absolute;
          color: #446
        ;
        }

      blockquote > p {
        margin: 0;
      }

    blockquote > p + p {
      margin-top: 1rem;
    }

    blockquote::before {
        content:  url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='%23777777'><path d='M9.983 3v7.391C9.983 16.095 6.252 19.961 1 21l-.995-2.151C2.437 17.932 4 15.211 4 13H0V3h9.983zM24 3v7.391c0 5.704-3.748 9.571-9 10.609l-.996-2.151C16.437 17.932 18 15.211 18 13h-3.983V3H24z'/></svg>");
        left: .2rem;
      }

    blockquote::after {
      content: "";
      left: .5rem;
      top: 2rem;
      width: 2px;
      height: 100%;
      background-color: currentColor;
      background-color: gray;
    }

    .box {
      display: flex;
      flex-direction: column;
      justify-content: space-around;
    }

    .columns {
      columns: 2 12rem;
      column-gap: 1rem;
    }

  </style>
</head>

<body><noscript>Our Website uses JavaScript. Please Enable it in Settings.</noscript>
  <section>
    <h1>(} digitized<b>being</b></h1>

    <div class="box">
      <blockquote>
        <p><b>digitized</b>: past simple and past participle of digitize</p>
        <p>to put information into the form of a series of the numbers 0 and 1, usually so that it can be understood and used by a computer</p>
      </blockquote>
      <blockquote>
        <p><b>being</b>: a person or thing that exists:</p>
        <p>
          <ul>
            <li>living being - they are taught to treat all living beings with respect and consideration.</li>
            <li>human being - dinosaurs pre-existed human beings by many millions of years.</li>
            <li>strange being - strange beings from outer space are still a popular subject for sci-fi movies.</li>
            <li>supreme being - believing that a supreme being exists differentiates humans from other animals.</li>
          </ul>
        </p>
      </blockquote>
    </div>

  </section>
</body>

</html>