checkpoint on fixing topbar for non-JavaScript browsers

2024-04-24 22:42:06 -07:00
1 parent e7d69bc232
commit e9717e6a48
@@ -1,6 +1,6 @@
 # Conflicting compilers and optimisers that broke this entry in 2023

-As briefly noted in the [index.html](%%REPO_URL%%/1986/marshall/index.html) gcc and clang caused different
+As briefly noted in the [index.html](index.html) gcc and clang caused different
 problems with this entry depending on the optimiser being enabled or not, where
 if the optimiser was enabled it would work with one compiler and not the other.
 But if you then disabled the optimiser the opposite problem would occur: the
@@ -24,7 +24,7 @@ It was not only one compiler that dumped core. Both dumped core with other
 behaviour, depending on what changes in code were made and the optimiser being
 on or off. Clang in macOS also dumped core!

-The [index.html](%%REPO_URL%%/1986/marshall/index.html) has the original fix
+The [index.html](index.html) has the original fix
 for clang which works with some compilers depending on the optimiser. When we
 refer to the code below we refer to the alternate code.

@@ -23,7 +23,7 @@ NOTE: that's not a typo or mistake but one can also do:
 We changed the alias that the author's suggested alias from a
 C-shell alias to a Bourne-like shell alias.

-Note that `shst.c` is renamed to [stig.c](%%REPO_URL%%/1990/stigstig.c) in the distribution.
+Note that `shst.c` is renamed to [stig.c](%%REPO_URL%%/1990/stig/stig.c) in the distribution.

 WARNING: This program's `how to compile` is too specific to a particular shell.
 The obfuscation of this program is more related to shell obfuscation than C
@@ -23,7 +23,7 @@ The author suggests trying:
 ```

 Notice that a file `a.c` has been generated.  Can you tell how `a.c` was
-produced?  How does `a.c` relate to [LANDER.BAS](%%REPO_URL%%/1991/ddsLANDER.BAS)?
+produced?  How does `a.c` relate to [LANDER.BAS](%%REPO_URL%%/1991/dds/LANDER.BAS)?

 What happens if you give the program a C program like itself? Try:

@@ -58,7 +58,7 @@ Then using the proper dictionary file it does:
 where `/usr/share/dict/words` is the dictionary file.

 Then it uses the [mkdict.sh](%%REPO_URL%%/1992/gson/mkdict.sh) script to create a dictionary file out
-of the files [index.html](%%REPO_URL%%/1992/gson/index.html), [try.sh](%%REPO_URL%%/1992/gson/try.sh) (itself) and
+of the files [index.html](index.html), [try.sh](%%REPO_URL%%/1992/gson/try.sh) (itself) and
 [Makefile](%%REPO_URL%%/1992/gson/Makefile) and it repeats the same commands as above. In the case no
 dictionary file can be found in the first step it only runs the commands once
 with the created dictionary file.
@@ -86,7 +86,7 @@ considered finished when all the `m`s are then `M`s.

 - [rince.data4](%%REPO_URL%%/1993/rince/rince.data4) Sokoban screen 13. Same rules as above.

-For a brief design description, see [design.html](%%REPO_URL%%/1993/rince/design.html).
+For a brief design description, see [design.html](design.html).


 ### WARNING for SunOS 4.1.x:
@@ -221,7 +221,7 @@ Despite all this, the translator is not exclusively limited to running the
 [anonymous.ten](%%REPO_URL%%/2001/anonymous/anonymous.ten.c) program.  Other trivial **_x86_** programs may
 run on the translator \- and I have successfully run a wide range of "Hello
 World" programs, including one of last year's IOCCC entries,
-[tomx](%%REPO_URL%%/2000/tomx/index.html).
+[2000/tomx](../../2000/tomx/index.html).


 ### Complete Program
@@ -18,8 +18,8 @@
    ./try.sh
 ```

-If you use vi(m) you can see a pattern in [herrmann2.cup](%%REPO_URL%%/2001/herrmann2herrmann2.cup) and
-[herrmann2.ioccc][(%%REPO_URL%%/2001/herrmann2herrmann2.ioccc]) by say:
+If you use vi(m) you can see a pattern in [herrmann2.cup](%%REPO_URL%%/2001/herrmann2/herrmann2.cup) and
+[herrmann2.ioccc][(%%REPO_URL%%/2001/herrmann2/herrmann2.ioccc]) by say:


 ```
@@ -32,7 +32,7 @@ and
    /l
 ```

-For additional fun in [herrmann2.cup](%%REPO_URL%%/2001/herrmann2herrmann2.cup) try:
+For additional fun in [herrmann2.cup](%%REPO_URL%%/2001/herrmann2/herrmann2.cup) try:


 ```
@@ -40,7 +40,7 @@ For additional fun in [herrmann2.cup](%%REPO_URL%%/2001/herrmann2herrmann2.cup)
    /q
 ```

-and in [herrmann2.ioccc](%%REPO_URL%%/2001/herrmann2herrmann2.ioccc) try:
+and in [herrmann2.ioccc](%%REPO_URL%%/2001/herrmann2/herrmann2.ioccc) try:

 ```
    /n
@@ -103,7 +103,7 @@ can do so like:

 ## Judges' remarks:

-Read the [sykes1.html](%%REPO_URL%%/2006/sykes1/sykes1.html) page source.
+Read the [sykes1.html](sykes1.html) page source.
 Now then read the C source.  Confused?  :-) If it's not clear try:

 ``` <!---sh-->
@@ -163,7 +163,7 @@ This entry has been tested on Windows (compiled with MS Visual Studio 2010 and
 supplied is good for Mac OS X, Linux and probably other Unices. I have received
 reports that the emulator works on Raspberry Pi/Android/ARM (you will need to
 compile with `-fsigned-char`) and iOS. You will need to adjust the
-[Makefile](%%REPO_URL%%/M2013/cable3/akefile) if your system lacks `sdl-config` to correctly point to the
+[Makefile](%%REPO_URL%%/2013/cable3/Makefile) if your system lacks `sdl-config` to correctly point to the
 SDL libraries and header files.

 On UNIX-based systems we can get raw keystrokes using `stty`. However Windows
@@ -221,7 +221,7 @@ the `fd.img` provided, which is a FreeDOS boot disk.
 Before running the emulator on a Unix-type system, `stty` needs to be used to
 put the keyboard into raw mode (and afterwards it needs to be put back to
 cooked). So, run the emulator using something like this script (provided as
-[cable3.sh](%%REPO_URL%%/c2013/cable3/able3.sh)):
+[cable3.sh](%%REPO_URL%%/2013/cable3/cable3.sh)):

 ``` <!---sh-->
    stty cbreak raw -echo min 0
@@ -162,7 +162,7 @@ The whole program is interpreted by macro expansion.
 For example, `S (K I)` is translated to a normal C code, `(s)((k)(i))`, or
 simply `s(k(i))`.

-This expression returns an abstract syntax tree, and [endoh1.c](%%REPO_URL%%/e2013/endoh1/ndoh1.c)
+This expression returns an abstract syntax tree, and [endoh1.c](%%REPO_URL%%/2013/endoh1/endoh1.c)
 evaluates it.

 This program uses a very simple "term rewriting" approach for evaluating SKI
@@ -110,7 +110,7 @@ them.
 ### User-modifiable Features

 The code can be user-modified simply by changing the build command line.
-The following symbols are defined in the [Makefile](%%REPO_URL%%/2013/millsMakefile):
+The following symbols are defined in the [Makefile](%%REPO_URL%%/2013/mills/Makefile):

 * `-DLT=x1,y1,z1,x2,y2,z2,...` defines the coordinates of the lights in the
 scene. It should be a comma-separated list of coordinates `(x, y, z)`, three per
@@ -129,7 +129,7 @@ The original program bound the server to `INADDR_ANY` to allow everyone to
 experience the server's output.  The Judges suggested that I instead restrict
 the bind to `INADDR_LOOPBACK` to reduce security alarms.  As a compliant veteran
 of innumerable post-ship late feature additions, I have modified the
-[Makefile](%%REPO_URL%%/2013/millsMakefile) to inject the new code without destroying the beautiful
+[Makefile](%%REPO_URL%%/2013/mills/Makefile) to inject the new code without destroying the beautiful
 spherical symmetry of the source code.  In addition, I have altered the word
 `sin_port` to the more family-friendly version `win_port` (via
 `-Dwin_port="sin_addr.s_addr=htonl(2130706433),R.sin_port"`) to protect against
@@ -29,7 +29,7 @@ ctrl-c/sending intr.
 ## Alternate code:

 This alternate code, provided by the author, is discussed in more detail by the
-author in the '[prog.c](%%REPO_URL%%/ 2015/duble/prog.c) vs [prog.alt.c](%%REPO_URL%%/2015/duble/prog.alt.c)' section of their remarks.
+author in the '[prog.c](%%REPO_URL%%/2015/duble/prog.c) vs [prog.alt.c](%%REPO_URL%%/2015/duble/prog.alt.c)' section of their remarks.


 ### Alternate build:
@@ -41,7 +41,7 @@ The "_Python_" in the award name refers to Monty Python, **not** the
 [programming language Python](https://en.wikipedia.org/wiki/Python_(programming_language)
 (the name of the programming language Python is derived from Monty Python).

-The shape of [prog.c](%%REPO_URL%%/2018/endoh2prog.c) is "Undead Parrot" based on "dead parrot". The
+The shape of [prog.c](%%REPO_URL%%/2018/endoh2/prog.c) is "Undead Parrot" based on "dead parrot". The
 message that appears in the bottom line of the output source code is the subject
 of the dialogue that appears in "Dead Parrot" and explains in various
 expressions that the parrot died. Also, the second **__<-_Source_of_Parrots__**
@@ -73,7 +73,7 @@ separator in the form of a single line followed by a section signifying the
 function of the program, a block with removed shape of lambda character. Even
 the official IOCCC size tool acknowledges this: When you call `./iocccsize -i
 <prog.c`, using the [2019 version of
-iocccsize](%%REPO_URL%%/2019/iocccsize.c), iocccsize returns **955**,
+iocccsize.c](%%REPO_URL%%/2019/iocccsize.c), iocccsize returns **955**,
 which is the Unicode codepoint of the **&#955;** character.

 It might be a surprise for you that according to the IOCCC size tool the program is
@@ -103,7 +103,7 @@ You can also try other programs from the Web. Many example programs are in the o
 entries from [quine contest][4].

 There is an alternative build path that requires the 2018 IOCCC size tool to complete. Put the tool
-source [iocccsize_2018.c](%%REPO_URL%%/2019/adamovskyiocccsize_2018.c) in the project directory and call
+source [iocccsize_2018.c](%%REPO_URL%%/2019/adamovsky/iocccsize_2018.c) in the project directory and call

 ``` <!---sh-->
    make identify
@@ -199,7 +199,7 @@ since it was developed using `char`s it should be always used safely.

 ### Spoilers:

- You can examine the [progSpoiler.c](%%REPO_URL%%/2019/adamovskyprogSpoiler.c) file. It is the original
+- You can examine the [progSpoiler.c](%%REPO_URL%%/2019/adamovsky/progSpoiler.c) file. It is the original
 final version of the interpreter, before I started the downsizing. It accepts
 one more optional parameter that specifies a filename for the output Unlambda
 function (it's the Unlambda function that remains after all function
@@ -163,7 +163,7 @@ among the programs that won IOCCC in the past), and _obscure bugs_ (see
 the questions about Linux core dumps below).

 To a casual eye, this entry may look similar to
-[2005/klausler](%%REPO_URL%%/2005/klausler/index.html).
+[2005/klausler](../../2005/klausler/index.html).
 However, `prog` is internationalized and way faster. On my machine,
 `./klausler abcdefghijklmnopqrstuvwxyz` printed only 3,965 perfect
 pangrams until I killed it after 144 hours running, while the
@@ -54,7 +54,7 @@ compresses differently? The judges know. :)
    diff -s guidelines.txt guidelines2.txt
 ```

-Of course you can  also use [2015/mills2](%%REPO_URL%%/2015/mills2/mills2.c) instead of
+Of course you can  also use [2015/mills2prog.c](%%REPO_URL%%/2015/mills2/prog.c) instead of
 `zcat` to verify the output file. The achieved compression ratio roughly matches
 that of the classic Unix `compress(1)` tool. And the source code is very
 compressed, too: It has exactly the same size as the  paragraph you are reading
@@ -35,8 +35,8 @@ the program and the script.

 ## Judges' remarks:

-[1991/davidguy](%%REPO_URL%%/1991/davidguy/index.html),
-[2011/blakely](%%REPO_URL%%/2011/blakely/index.html), ...
+[1991/davidguy](../..//1991/davidguy/index.html),
+[2011/blakely](../../2011/blakely/index.html), ...

 ...This entry likely concludes the IOCCC category "Cellular automata simulators";
 it would be very hard to beat it on its field.
@@ -162,7 +162,7 @@ White](https://www.glyphweb.com/arda/g/gandalf.html) and the [Judges of
 the IOCCC](../../judges.html).

 Output of `iocccsize`, using the [2019 version of
-iocccsize](%%REPO_URL%%/2019/iocccsize.c), is carefully selected.  For
+iocccsize](%%REPO_URL%%/2019/poikola/iocccsize.c), is carefully selected.  For
 the sake of clarity, I used single letter variables in the code. I also avoided
 unnecessary use of functions.  Like a
 [tripundra](https://en.wikipedia.org/wiki/Tripundra), this program has three
@@ -29,11 +29,11 @@ What happens if you do

 ## Judges' remarks:

-Clever use of the C99 complex data type. The [spoiler](%%REPO_URL%%/2020/endoh2/spoiler/spoiler.html) directory
+Clever use of the C99 complex data type. The [spoiler](spoiler.html) directory
 contains clues as to how some winning authors create / edit programs into ASCII
 shapes.

-With the source from the [spoiler](%%REPO_URL%%/2020/endoh2/spoiler/spoiler.html) directory could you make the code
+With the source from the [spoiler](spoiler.html) directory could you make the code
 render for a larger terminal window?  How about adding more glyphs?


@@ -4,7 +4,7 @@ will need two different packages: the library itself but also the dev package
 that has the header files etc. If you use the Makefile obviously you need `make`
 too.

-In [gameplay.html](%%REPO_URL%%/2020/ferguson1/gameplay.html)
+In [gameplay.html](gameplay.html)
 I show how to easily customise the colours, set up
 different gameplay modes and various other things. The troubleshooting.md
 and terminals.md as well as bugs.md include a variety of information
@@ -522,7 +522,7 @@ The [prog.3.c](%%REPO_URL%%/2020/ferguson1/prog.3.c) is in a more artistic layou
 additional obfuscation technique (see spoilers) but it also has more digraphs
 and as the judges said they feel that digraphs are dated so that's probably why
 they chose the first layout. The [prog.3-j.c](%%REPO_URL%%/2020/ferguson1/prog.3-j.c) version is
-[prog.3.c](%%REPO_URL%%%%REPO_URL%%//2020/ferguson1/prog.3.c) with a shorter `J` macro.
+[prog.3.c](%%REPO_URL%%%%REPO_URL%%/2020/ferguson1/prog.3.c) with a shorter `J` macro.

 The prog.alt.c version is the one that allows for customising the bug colour and
 it's used in both [snake-colours.sh][] and [play.sh][]. It also calls `erase()`
@@ -453,7 +453,7 @@ For examples using it (and a delicious challenge) see [recode.html][] (or
 </div>

 The parser is in a sense rather rudimentary but allows for both interactive and
-automatic (e.g. via the [recode]((%%REPO_URL%%/2020/ferguson2recode.c) program) input. This does mean that
+automatic (e.g. via the [recode]((%%REPO_URL%%/2020/ferguson2/recode.c) program) input. This does mean that
 something like the following can happen:

 ``` <!---sh-->
@@ -475,7 +475,7 @@ a:active {
 .theader {
  width: 100%;
  min-height: 72px;
-  box-shadow: 0 5px 10px 0 rgba(21,76,159,.0509803922);
+  border-bottom: 1px solid #eee;
 }

 .topbar {
@@ -490,13 +490,55 @@ a:active {
  display: flex;
  align-items: center;
  justify-content: space-between;
+  /* Fixed Header Menu Issue */
  max-width: 1140px;
  margin-left: auto;
  margin-right: auto;
 }

+@media (min-width: 1025px) and (max-width: 1100px) {
+  .container {
+    max-width: 840px;
+  }
+}
+
+@media (min-width: 1101px) and (max-width: 1150px) {
+  .container {
+    max-width: 900px;
+  }
+}
+
+@media (min-width: 1151px) and (max-width: 1200px) {
+  .container {
+    max-width: 970px;
+  }
+}
+
+@media (min-width: 1201px) and (max-width: 1250px) {
+  .container {
+    max-width: 1000px;
+  }
+}
+
+@media (min-width: 1251px) and (max-width: 1300px) {
+  .container {
+    max-width: 1060px;
+  }
+}
+
+@media (min-width: 1301px) and (max-width: 1350px) {
+  .container {
+    max-width: 1100px;
+  }
+}
+
 .logo {
-  color: #154c9f;
+  margin-top: auto;
+  margin-bottom: auto;
+}
+
+.logo-link {
+  color: #154c9f !important;
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
@@ -504,9 +546,12 @@ a:active {
  font-size: 40px;
  cursor: pointer;
  text-decoration: none !important;
+  border-bottom: none !important;
+}

-  margin-top: auto;
-  margin-bottom: auto;
+.logo-link:hover {
+  opacity: 0.8;
+  transition: all .3s ease;
 }

 .topbar-items {
@@ -529,6 +574,11 @@ a:active {
  display: block;
 }

+.item-header:hover {
+  opacity: 0.8;
+  transition: all .3s ease;
+}
+
 .topbar-items .sub-item {
  position: absolute;
  display: none;
@@ -548,6 +598,44 @@ a:active {
  display: flex !important;
 }

+.topbar-items .item .sub-item .outfit-font .sub-item-link {
+  color: #154c9f;
+  text-decoration: none;
+  border-bottom: none;
+}
+
+.sub-item-link:hover {
+  opacity: 0.8;
+  transition: all .3s ease;
+}
+
+.topbar-js-label {
+  display: block;
+  position: absolute;
+  top: 40px;
+  right: 20px;
+
+  color: #154c9f !important;
+  font-family: "Outfit", sans-serif;
+  font-optical-sizing: auto;
+  font-weight: 700;
+  font-style: normal;
+  font-size: 14px;
+
+  text-decoration: none;
+  border-bottom: none;
+}
+
+@media (scripting: enabled) {
+  .topbar-js-label {
+    display: none;
+  }
+}
+
+.topbar-js-label:hover {
+  border-bottom: none;
+}
+
 /* Header ======================================================================================== */

 /* Style the header */
@@ -746,14 +834,21 @@ a:active {
 }

 .topbar-mobile-menu {
+  display: none;
  position: absolute;
-  right: 10px;
+  right: 20px;
  top: 20px;
  height: 48px;
  width: 48px;
  border: none;
 }

+@media (scripting: enabled) {
+  .topbar-mobile-menu {
+    display: block;
+  }
+}
+
 .hide-content {
  display: none;
 }