website/_layout.html at master · RangerDevv/website · 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
143
144
@define "header"
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="shortcut icon" href="/img/v-logo.png">
  <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,300,100,200,500,700|Roboto+Mono:400,300,100,200,500" media="none" onload="if(media!='all')media='all'"><noscript><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,300,100,200,500,700|Roboto+Mono:400,300,100,200,500"></noscript>
  @css "app.css?28"
  <!--
  <script src="tokenizer.js"></script>
  -->
  <title>The V Programming Language</title>
</head>
<body>
<div id='app'>

  <div class='header'>
    <div class='flex'></div>
    <a href='/'><img src='/img/v-logo.png' class='logo' /></a>

    <div class='nav'>
      <div class="navDropdown">
        <div class="dropbtn" style="background-color: transparent; outline: none; border: none; cursor: pointer;">
          <a target=_blank href='https://github.com/vlang/v/blob/master/doc/docs.md' class='item' style="	font-size: 22px;
          font-weight: 400;">%documentation</a>
          <i class="fa fa-caret-down"></i>
        </div>
        <div class="dropdown-content">
          <a target=_blank href='https://github.com/vlang/V/tree/master/examples' class='item'>%examples</a>
          <a target=_blank href='https://github.com/vlang/v/discussions' class='item'>Forum</a>
          <a target=_blank href='https://github.com/vlang/v/blob/master/tutorials' class='item'>Tutorials</a>
        </div>
      </div>
      <a target=_blank href='https://modules.vlang.io' class='item'>Stdlib Docs</a>
      <a target=_blank href='https://vpm.vlang.io/' class='item'>vpm</a>
      <a target=_blank href='https://blog.vlang.io' class='item'>Blog</a>

      <!-- <a target=_blank href='https://v-wasm.now.sh' class='item'>Playground</a> -->
      <a target=_blank href='https://play.vlang.io' class='item'>Playground</a>
      <!-- <a href='/#builtinv' class='item'>Built in V</a> -->

    <!--
      <a target=_blank href='https://github.com/vlang/v/wiki/FAQ' class='item'>%faq</a>
      <a target=_blank href='https://github.com/vlang/v/wiki/Backers' class='item'>Backers</a>
    -->
    </div>
    <div class="donate-button">
      <a target=_blank  href='https://patreon.com/vlang' class='patreon'><img src='/img/patreon.png' /></a> &nbsp;
      <a target=_blank href="https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=HRGVJ2LA2LKJ8&item_name=Support+V+development&currency_code=USD&source=url&lc=US" class="paypal">PayPal</a> &nbsp;
  <a target=_blank href='https://github.com/sponsors/medvednikov' class="paypal">GitHub $</a> &nbsp;

  <script>
    // a function to toggle dark mode
    function toggleTheme() {
      let currTheme = localStorage.getItem("theme");
      if (localStorage.getItem("theme")) {
        currTheme = localStorage.getItem("theme");

      } else {
        localStorage.setItem("theme", "light");
      }
      if (localStorage.getItem("theme")=="light") {
        document.getElementsByClassName("dark-mode-button")[0].innerHTML = "☀️";
        // loop over all the block elements and change their text color
        let blocks = document.getElementsByClassName("block");
        for (let i = 0; i < blocks.length; i++) {
          blocks[i].style.color = "#ffffff";
          // change the box shadow to make the blocks stand out
          // blocks[i].style.boxShadow = "0 0 90px -15px #5058fc86 ";
        }
        // get all the heading tags and change their text color
        let headings = document.getElementsByTagName("h1");
        for (let i = 0; i < headings.length; i++) {
          headings[i].style.color = "#fff";
        }
        // loop over all the section elements and change their text color
        let sections = document.getElementsByClassName("section");
        for (let i = 0; i < sections.length; i++) {
          sections[i].style.color = "#ffffff";
        }
        document.getElementsByClassName("landing")[0].style.backgroundColor = "#101010";
        document.getElementById("app").style.backgroundColor = "#101010";
        // change the text color of nav items
        let navItems = document.getElementsByClassName("item");
        for (let i = 0; i < navItems.length; i++) {
          navItems[i].style.color = "#ffffff";
        }
        // get the version and change its color
        document.getElementsByClassName("version")[0].style.color = "#ffffff";
        // document.getElementsByClassName("header")[0].style.backgroundColor = "#000000";
        document.getElementsByClassName("subTitle")[0].style.color = "#ffffff";
        localStorage.setItem("theme", "dark");
      } else {
        document.getElementsByClassName("dark-mode-button")[0].innerHTML = "🌙";
        document.getElementsByClassName("landing")[0].style.backgroundColor = "#ffffff";
        document.getElementById("app").style.backgroundColor = "#ffffff";
        let blocks = document.getElementsByClassName("block");
        for (let i = 0; i < blocks.length; i++) {
          blocks[i].style.color = "#000000";
          // blocks[i].style.boxShadow = "0 0 20px 0 rgba(0, 0, 0, 0.169)";
        }
        let headings = document.getElementsByTagName("h1");
        for (let i = 0; i < headings.length; i++) {
          headings[i].style.color = "#000000";
        }
        let sections = document.getElementsByClassName("section");
        for (let i = 0; i < sections.length; i++) {
          sections[i].style.color = "#000000";
        }
        let navItems = document.getElementsByClassName("item");
        for (let i = 0; i < navItems.length; i++) {
          navItems[i].style.color = "#000000";
        }
        document.getElementsByClassName("version")[0].style.color = "#000000";
        // document.getElementsByClassName("header")[0].style.backgroundColor = "#ffffff";
        document.getElementsByClassName("subTitle")[0].style.color = "#000000";
        localStorage.setItem("theme", "light");
      }

      // as soon ask the user leaves the page, save the theme to local storage
      window.onbeforeunload = function() {
        localStorage.setItem("theme", currTheme);
      }
    }

    toggleTheme()

  </script>

    <!-- a dark and light mode switch -->
    <div class="dark-mode-switch">
      <button onclick="toggleTheme()" class="dark-mode-button" style="font-size: x-large; background-color: transparent; border: none; padding-bottom: 5px;">🌙</button>
    </div>
    </div>
    <div class='flex'></div>
  </div>
@end

@define "footer"
</body>
</html>
@end