This is an automated email from the ASF dual-hosted git repository.

grobmeier pushed a commit to branch ms12_conversion_of_md_files
in repository https://gitbox.apache.org/repos/asf/logging-log4j2.git

commit d1559658e3d9894198113d8a3131743638a6324e
Author: Christian Grobmeier <[email protected]>
AuthorDate: Mon Mar 4 15:23:37 2024 +0100

    better handling of fixed toc
---
 src/asciidoc/templates/document.html.erb          | 77 ++++++++++++++++-------
 src/site/asciidoc/getting-started/index.adoc      | 76 ++++++++++++++++++++++
 src/site/resources/css/logging-custom.css         | 38 +++++++----
 src/site/resources/js/ScrollTrigger-3.12.5.min.js | 11 ++++
 src/site/resources/js/gsap-3.12.5.min.js          | 11 ++++
 5 files changed, 176 insertions(+), 37 deletions(-)

diff --git a/src/asciidoc/templates/document.html.erb 
b/src/asciidoc/templates/document.html.erb
index 0d462141e1..655af69503 100644
--- a/src/asciidoc/templates/document.html.erb
+++ b/src/asciidoc/templates/document.html.erb
@@ -44,19 +44,12 @@
 
 </head>
 <body>
-<%
-  if (attr? :toc) && (attr? 'toc-placement', 'auto') %>
-  <div id="toc" class="toc2">
-    <div class="logo">
-      <img src="/images/logo.png" />
-    </div>
-    <div id="toctitle"><%= attr 'toc-title' %></div>
-    <%= converter.convert self, 'outline' %>
-  </div><%
-  end
-%>
 
 <div id="header">
+  <div class="logo">
+    <img src="/images/log4j-logo.png" />
+  </div>
+
   <nav class="main-menu">
     <ul>
       <li><a href="#">About</a></li>
@@ -95,20 +88,35 @@
   </nav>
 </div>
 
-<div id="content">
-    <h1><%= doctitle %></h1>
-    <%= content %>
-</div><%
-  unless !footnotes? || attr?(:nofootnotes) %>
-    <div id="footnotes">
-      <hr><%
-      footnotes.each do |fn| %>
-        <div class="footnote" id="_footnote_<%= fn.index %>">
-          <a href="#_footnoteref_<%= fn.index %>"><%= fn.index %></a>. <%= 
fn.text %>
-        </div><%
-      end %>
+<div class="content-container">
+  <%
+    if (attr? :toc) && (attr? 'toc-placement', 'auto') %>
+    <div class="table-of-content">
+
+      <div class="table-of-content-title" id="toctitle"><%= attr 'toc-title' 
%></div>
+      <%= converter.convert self, 'outline' %>
     </div><%
-  end %><%
+    end
+  %>
+
+  <div id="content">
+      <h1><%= doctitle %></h1>
+      <%= content %>
+  </div><%
+    unless !footnotes? || attr?(:nofootnotes) %>
+      <div id="footnotes">
+        <hr><%
+        footnotes.each do |fn| %>
+          <div class="footnote" id="_footnote_<%= fn.index %>">
+            <a href="#_footnoteref_<%= fn.index %>"><%= fn.index %></a>. <%= 
fn.text %>
+          </div><%
+        end %>
+      </div><%
+    end %>
+</div>
+
+
+  <%
   unless nofooter %>
     <div id="footer">
       <div class="footer-blocks">
@@ -165,6 +173,27 @@
       </div>
     </div><%
   end %>
+
+<script src="/js/gsap-3.12.5.min.js"></script>
+<script src="/js/ScrollTrigger-3.12.5.min.js"></script>
+<script>
+    document.addEventListener('DOMContentLoaded', function() {
+        let tween = gsap.to(".table-of-content", {
+            delay:0.1,
+            duration: 0.5,
+            backgroundColor: '#ededed',
+            ease: "power3.out"
+        });
+
+        ScrollTrigger.create({
+            trigger: '.table-of-content',
+            start: 'top top',
+            pin: '.table-of-content',
+            animation: tween,
+            toggleActions: 'play none none reverse'
+        });
+    });
+</script>
 <script>
     document.addEventListener('DOMContentLoaded', function() {
         var menuItems = document.querySelectorAll('#header nav > ul > li');
diff --git a/src/site/asciidoc/getting-started/index.adoc 
b/src/site/asciidoc/getting-started/index.adoc
new file mode 100644
index 0000000000..cf6bd70a6c
--- /dev/null
+++ b/src/site/asciidoc/getting-started/index.adoc
@@ -0,0 +1,76 @@
+////
+    Licensed to the Apache Software Foundation (ASF) under one or more
+    contributor license agreements.  See the NOTICE file distributed with
+    this work for additional information regarding copyright ownership.
+    The ASF licenses this file to You under the Apache License, Version 2.0
+    (the "License"); you may not use this file except in compliance with
+    the License.  You may obtain a copy of the License at
+
+         https://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+////
+
+= Getting started with Apache Log4j
+
+Apache Log4j is a framework that helps you understand, what a software system 
actually does.
+Imagine you are joining a new project as a junior developer and you are 
overwhelmed by the
+hundreds of thousands of lines of code. Reading all those lines will cost you 
a lot of time.
+To understand such a system you can connect to it using a debugger and follow 
every step the system does.
+Or you can read a log file: a file, where the system writes information about 
it's state, what it does
+and with what data it currently operates.
+
+This is similar to a debugger, but also has some advantages that a debugger 
does not have:
+
+You can look into the past. When you write log files for production systems, 
you can spot errors
+that happened, even when they are few days old.
+Sometimes, you are also not able to reproduce a very specific error with the 
debugger, no matter
+how accurately a user describes their problem. With well done logs, you may 
have access to information,
+that a user can't tell you.
+
+Frameworks like Log4j don't only allow you to write basic strings to files. 
Log4j is able
+to write to different kinds of outputs, from Console to Queues and even 
databases.
+
+== What do I need to know?
+
+Logging Frameworks are fundamental, and Log4j is also fundamental. To work 
with it, you don't require
+any special skills except for Java coding skills. If you know Exceptions, 
basic XML rules (for configuration)
+and general Java syntax (Strings, maybe Lambda basics) you are good to go.
+
+== Installing Apache Log4j
+
+The best way to install Log4j is by using a build tool such as Maven or Gradle.
+
+[source,xml,indent=0,role="primary"]
+.Maven
+----
+<dependency>
+    <groupId>com.example</groupId>
+    <artifactId>some-library</artifactId>
+    <version>1.2.3</version>
+</dependency>
+----
+
+[source,indent=0,role="secondary"]
+.Gradle
+----
+compile 'com.example:some-library:1.2.3'
+----
+
+
+<dependencies>
+<dependency>
+<groupId>org.apache.logging.log4j</groupId>
+<artifactId>log4j-api</artifactId>
+<version>2.22.1</version>
+</dependency>
+<dependency>
+<groupId>org.apache.logging.log4j</groupId>
+<artifactId>log4j-core</artifactId>
+<version>2.22.1</version>
+</dependency>
+</dependencies>
\ No newline at end of file
diff --git a/src/site/resources/css/logging-custom.css 
b/src/site/resources/css/logging-custom.css
index 3003d5eb11..24133079f0 100644
--- a/src/site/resources/css/logging-custom.css
+++ b/src/site/resources/css/logging-custom.css
@@ -1,12 +1,20 @@
 #header {
     display: flex;
     height: 10vh;
-    width: 80vw;
     max-width: 100%;
-    margin-right:0;
     align-items: center;
-    background-color: white;
     z-index: 10000;
+    background-color: #e7e7e7;
+    border-bottom: 1px solid lightgrey;
+
+}
+
+#header .logo {
+    margin-right: 1.5em;
+}
+
+#header .logo img {
+    max-height: 6vh;
 }
 
 #header .main-menu {
@@ -79,12 +87,13 @@
 /** Footer */
 #footer {
     z-index: 1000;
+    background-color: #333333;
 }
 
 #footer .footer-blocks {
     display: flex;
     justify-content: center;
-    background-color: #333;
+    background-color: #333333;
 }
 
 #footer .footer-blocks div {
@@ -122,20 +131,23 @@
     padding: 1em;
 }
 
-
-#toc .logo img {
-    max-height: 6vh;
+.content-container {
+    display: flex;
 }
 
-#toc .logo {
-    margin-bottom: 2em;
-    text-align: center;
+
+.content-container .content {
+    width: 80vw;
+    overflow: auto;
+    height: 100%;
 }
 
-#toc.toc2 {
-    padding-top: 2em;
+.table-of-content {
     width: 20vw;
-    border-top: 1px solid #e7e7e9;
+    padding: 2em;
+    background-color: #fff;
 }
 
 
+
+
diff --git a/src/site/resources/js/ScrollTrigger-3.12.5.min.js 
b/src/site/resources/js/ScrollTrigger-3.12.5.min.js
new file mode 100644
index 0000000000..cceb2b91a8
--- /dev/null
+++ b/src/site/resources/js/ScrollTrigger-3.12.5.min.js
@@ -0,0 +1,11 @@
+/*!
+ * ScrollTrigger 3.12.5
+ * https://gsap.com
+ * 
+ * @license Copyright 2024, GreenSock. All rights reserved.
+ * Subject to the terms at https://gsap.com/standard-license or for Club GSAP 
members, the agreement issued with that membership.
+ * @author: Jack Doyle, [email protected]
+ */
+
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof 
module?t(exports):"function"==typeof 
define&&define.amd?define(["exports"],t):t((e=e||self).window=e.window||{})}(this,function(e){"use
 strict";function _defineProperties(e,t){for(var r=0;r<t.length;r++){var 
n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in 
n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function r(){return 
Ce||"undefined"!=typeof 
window&&(Ce=window.gsap)&&Ce.registerPlugin&&Ce}function z(e, [...]
+
diff --git a/src/site/resources/js/gsap-3.12.5.min.js 
b/src/site/resources/js/gsap-3.12.5.min.js
new file mode 100644
index 0000000000..14dd0a4853
--- /dev/null
+++ b/src/site/resources/js/gsap-3.12.5.min.js
@@ -0,0 +1,11 @@
+/*!
+ * GSAP 3.12.5
+ * https://gsap.com
+ * 
+ * @license Copyright 2024, GreenSock. All rights reserved.
+ * Subject to the terms at https://gsap.com/standard-license or for Club GSAP 
members, the agreement issued with that membership.
+ * @author: Jack Doyle, [email protected]
+ */
+
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof 
module?e(exports):"function"==typeof 
define&&define.amd?define(["exports"],e):e((t=t||self).window=t.window||{})}(this,function(e){"use
 strict";function 
_inheritsLoose(t,e){t.prototype=Object.create(e.prototype),(t.prototype.constructor=t).__proto__=e}function
 _assertThisInitialized(t){if(void 0===t)throw new ReferenceError("this hasn't 
been initialised - super() hasn't been called");return t}function 
r(t){return"string"==typeo [...]
+

Reply via email to