vorburger commented on code in PR #35:
URL: https://github.com/apache/fineract-site/pull/35#discussion_r1912457369
##########
index.html:
##########
@@ -35,136 +35,789 @@
<div class="nav-wrapper">
<div class="container">
<a href="#top" class="brand-logo">
- <img class="logo" src="images/apache-fineract-logo.png"
alt="Fineract Logo"/>
- <span class="brand">Apache Fineract®</span>
- <img referrerpolicy="no-referrer-when-downgrade"
src="https://static.scarf.sh/a.png?x-pxid=2067fdb9-816d-461c-8713-bfb6cd8bb098";
/>
+ <div class="logo-wrapper">
+ <div class="logo-container">
+ <img class="logo-img" src="images/apache-fineract-logo.png"
alt="Apache Fineract Logo"/>
+ <div class="brand-text">
+ <span class="brand-name">Apache Fineract®</span>
+ </div>
+ </div>
+ </div>
</a>
<a href="#" data-activates="mobile-menu"
class="button-collapse"><i class="material-icons">menu</i></a>
- <ul class="right hide-on-med-and-down">
- <li><a class="ghost-white-hover" href="#about">About</a></li>
- <li><a class="ghost-white-hover"
href="#contribute">Contribute</a></li>
- <li><a class="ghost-white-hover"
href="#downloads">Downloads</a></li>
- <li><a class="ghost-white-hover"
href="#resources">Resources</a></li>
- <li><a class="ghost-white-hover"
href="#reference">Reference</a></li>
+
+ <ul class="right hide-on-med-and-down nav-links">
+ <li>
+ <a class="nav-link" href="#about">
+ <i class="material-icons left">info</i>About
+ </a>
+ </li>
+ <li>
+ <a class="nav-link" href="#contribute">
+ <i class="material-icons left">people</i>Contribute
+ </a>
+ </li>
+ <li>
+ <a class="nav-link" href="#downloads">
+ <i class="material-icons left">download</i>Downloads
+ </a>
+ </li>
+ <li>
+ <a class="nav-link" href="#resources">
+ <i class="material-icons left">library_books</i>Resources
+ </a>
+ </li>
+ <li>
+ <a class="nav-link" href="#reference">
+ <i class="material-icons left">link</i>Reference
+ </a>
+ </li>
</ul>
+
<ul class="side-nav ghost-white jet-text" id="mobile-menu">
- <li class="side-nav-heading">Apache Fineract®</li>
- <li><a class="jet-hover" href="#about"
onclick="closeSideNav()">About</a></li>
- <li><a class="jet-hover" href="#contribute"
onclick="closeSideNav()">Contribute</a></li>
- <li><a class="jet-hover" href="#downloads"
onclick="closeSideNav()">Downloads</a></li>
- <li><a class="jet-hover" href="#resources"
onclick="closeSideNav()">Resources</a></li>
- <li><a class="jet-hover" href="#reference"
onclick="closeSideNav()">Reference</a></li>
+ <li class="side-nav-header">
+ <div class="logo-container">
+ <img class="logo" src="images/apache-fineract-logo.png"
alt="Fineract Logo"/>
+ <span class="brand">Apache Fineract®</span>
+ </div>
+ </li>
+ <li><div class="divider"></div></li>
+ <li>
+ <a class="side-nav-link" href="#about"
onclick="closeSideNav()">
+ <i class="material-icons left">info</i>About
+ </a>
+ </li>
+ <li>
+ <a class="side-nav-link" href="#contribute"
onclick="closeSideNav()">
+ <i class="material-icons left">people</i>Contribute
+ </a>
+ </li>
+ <li>
+ <a class="side-nav-link" href="#downloads"
onclick="closeSideNav()">
+ <i class="material-icons left">download</i>Downloads
+ </a>
+ </li>
+ <li>
+ <a class="side-nav-link" href="#resources"
onclick="closeSideNav()">
+ <i class="material-icons left">library_books</i>Resources
+ </a>
+ </li>
+ <li>
+ <a class="side-nav-link" href="#reference"
onclick="closeSideNav()">
+ <i class="material-icons left">link</i>Reference
+ </a>
+ </li>
</ul>
</div>
</div>
</nav>
</div>
+
+ <style>
+ .navbar-fixed {
+ height: 72px;
+ }
+
+ .nav-wrapper {
+ padding: 0 15px;
+ }
+
+ /* Logo Styles */
+ .logo-wrapper {
+ display: flex;
+ align-items: center;
+ height: 72px;
+ padding: 5px 0;
+ }
+
+ .logo-container {
+ display: flex;
+ align-items: center;
+ gap: 15px;
+ }
+
+ .logo-img {
+ height: 52px;
+ width: auto;
+ margin: 0;
+ }
+
+ .brand-text {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ }
+
+ .brand-name {
+ font-size: 1.8rem;
+ font-weight: 700;
+ color: #ffffff;
+ line-height: 1.2;
+ letter-spacing: 0.5px;
+ text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
+ }
+
+ /* Responsive adjustments */
+ @media only screen and (max-width: 992px) {
+ .brand-logo {
+ transform: translateX(-50%);
+ left: 50%;
+ }
+
+ .logo-img {
+ height: 46px;
+ }
+
+ .brand-name {
+ font-size: 1.6rem;
+ }
+ }
+
+ @media only screen and (max-width: 600px) {
+ .logo-img {
+ height: 40px;
+ }
+
+ .brand-name {
+ font-size: 1.4rem;
+ }
+ }
+
+ /* Rest of the existing styles */
+ .nav-links li {
+ margin: 0 5px;
+ }
+
+ .nav-link {
+ display: flex;
+ align-items: center;
+ padding: 0 15px;
+ height: 72px;
+ transition: background-color 0.3s ease;
+ border-bottom: 3px solid transparent;
+ }
+
+ .nav-link:hover {
+ background-color: rgba(255, 255, 255, 0.1);
+ border-bottom: 3px solid #26a69a;
+ }
+
+ .nav-link i {
+ margin-right: 8px;
+ transition: transform 0.3s ease;
+ }
+
+ .nav-link:hover i {
+ transform: translateY(-2px);
+ }
+
+ .side-nav-header {
+ padding: 20px 15px;
+ background-color: #343434;
+ }
+
+ .side-nav-header .logo-container {
+ flex-direction: column;
+ align-items: center;
+ }
+
+ .side-nav-header .brand {
+ color: white;
+ margin-top: 10px;
+ text-align: center;
+ }
+
+ .side-nav-link {
+ display: flex !important;
+ align-items: center;
+ padding: 15px !important;
+ height: auto !important;
+ transition: background-color 0.3s ease;
+ }
+
+ .side-nav-link i {
+ margin-right: 15px !important;
+ color: #26a69a;
+ }
+
+ .side-nav-link:hover {
+ background-color: #f5f5f5 !important;
+ }
+
+ @media only screen and (max-width: 992px) {
+ .brand-logo {
+ left: 50%;
+ transform: translateX(-50%);
+ }
+ }
+ </style>
</header>
+ <div class="cube-loader">
+ <div class="cube">
+ <div class="face front"></div>
+ <div class="face back"></div>
+ <div class="face right"></div>
+ <div class="face left"></div>
+ <div class="face top"></div>
+ <div class="face bottom"></div>
+ <div class="inner-cube">
+ <div class="face front"></div>
+ <div class="face back"></div>
+ <div class="face right"></div>
+ <div class="face left"></div>
+ <div class="face top"></div>
+ <div class="face bottom"></div>
+ </div>
+ </div>
+ </div>
+
+ <style>
+ .cube-loader {
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 120px;
+ height: 120px;
+ perspective: 1000px;
+ display: none; /* Hidden by default, show with .show class */
+ }
+
+ .cube-loader.show {
+ display: block;
+ }
+
+ .cube {
+ position: relative;
+ width: 100%;
+ height: 100%;
+ transform-style: preserve-3d;
+ animation: rotate 4s infinite linear;
+ }
+
+ .cube .face {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ background: rgba(186, 0, 143, 0.9);
+ border: 2px solid rgba(186, 0, 143, 1);
+ box-sizing: border-box;
+ }
+
+ .inner-cube {
+ position: absolute;
+ width: 60%;
+ height: 60%;
+ top: 20%;
+ left: 20%;
+ transform-style: preserve-3d;
+ }
+
+ .inner-cube .face {
+ background: rgba(0, 119, 190, 0.9);
+ border: 2px solid rgba(0, 119, 190, 1);
+ }
+
+ .inner-cube::after {
+ content: '';
+ position: absolute;
+ width: 40%;
+ height: 40%;
+ top: 30%;
+ left: 30%;
+ background: rgba(141, 198, 63, 0.9);
+ border: 2px solid rgba(141, 198, 63, 1);
+ transform: translateZ(0);
+ }
+
+ /* Face Transformations */
+ .cube .face.front { transform: rotateY(0deg) translateZ(60px); }
+ .cube .face.back { transform: rotateY(180deg) translateZ(60px); }
+ .cube .face.right { transform: rotateY(90deg) translateZ(60px); }
+ .cube .face.left { transform: rotateY(-90deg) translateZ(60px); }
+ .cube .face.top { transform: rotateX(90deg) translateZ(60px); }
+ .cube .face.bottom { transform: rotateX(-90deg) translateZ(60px); }
+
+ .inner-cube .face.front { transform: rotateY(0deg) translateZ(36px); }
+ .inner-cube .face.back { transform: rotateY(180deg) translateZ(36px); }
+ .inner-cube .face.right { transform: rotateY(90deg) translateZ(36px); }
+ .inner-cube .face.left { transform: rotateY(-90deg) translateZ(36px); }
+ .inner-cube .face.top { transform: rotateX(90deg) translateZ(36px); }
+ .inner-cube .face.bottom { transform: rotateX(-90deg) translateZ(36px); }
+
+ @keyframes rotate {
+ 0% {
+ transform: rotateX(0deg) rotateY(0deg);
+ }
+ 100% {
+ transform: rotateX(360deg) rotateY(360deg);
+ }
+ }
+
+ /* Add shadow effect */
+ .cube-loader::after {
+ content: '';
+ position: absolute;
+ bottom: -20px;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 85%;
+ height: 10px;
+ background: rgba(0, 0, 0, 0.2);
+ border-radius: 50%;
+ filter: blur(5px);
+ animation: shadow 4s infinite linear;
+ }
+
+ @keyframes shadow {
+ 0%, 100% {
+ transform: translateX(-50%) scale(1);
+ opacity: 0.4;
+ }
+ 50% {
+ transform: translateX(-50%) scale(1.2);
+ opacity: 0.2;
+ }
+ }
+ </style>
+
+ <script>
+ // Function to show/hide loader
+ function showLoader() {
+ document.querySelector('.cube-loader').classList.add('show');
+ }
+
+ function hideLoader() {
+ document.querySelector('.cube-loader').classList.remove('show');
+ }
+ </script>
<main class="container">
<section class="section">
<h3 class="center-align">Platform for Digital Financial Services</h3>
- <p class="flow-text justify-align">
- Apache Fineract® (\’fīn-,ә-,rakt\) is
open source software for financial services.
- </p>
- <p class="flow-text justify-align">
- At Apache Fineract®, our mission is to build, maintain and enhance
a cloud-ready
- core banking system for robust, scalable, and secure operations of
financial institutions.
- Fineract® provides a reliable, robust, and affordable solution
- for entrepreneurs, financial institutions, and service providers.
- We believe in financial services for everyone, including and
especially for the unbanked and underbanked.
-
- Fineract® is aimed at innovative mobile and cloud-based solutions,
- and enables digital transaction accounts for all.
- </p>
- <p class="flow-text justify-align">ASF Fineract® 1.x is a
cloud-ready platform with open APIs. It is, by design, a headless application.
- Solution Providers, including system integrators and banking
system operators are able to build their own front end solutions on top of
Fineract®.
- We encourage all Consumers (or users) of fineract to consult
competent technical resources for all questions related to securing and running
the software properly.
- Please consult the Apache license for further legal information
and the <a
href="https://cwiki.apache.org/confluence/pages/viewpage.action?pageId=91554327";>FAQ<a></a>
and <a
href="https://cwiki.apache.org/confluence/display/FINERACT/Securing+Fineract";>Securing
Fineract</a> for key information about the setup of this project.
- </p>
-
- <p class="flow-text justify-align"> NOTE DEPRECATED SUB-PROJECT: The
Fineract® Community has also worked on a code project called Fineract®
CN,
- intended to operate as a microservice architecture. If you
find references to this CN project it was not released. In May 2023, the
Fineract® Community decided to DEPRECATE this project, and archived in late
2023. This side-project served an important role in describing a microservice
approach.
- </p>
+
+ <div class="row">
+ <div class="col s12">
+ <div class="card-panel">
+ <h4><i class="material-icons left">account_balance</i>What is
Apache Fineract?</h4>
+ <p class="flow-text justify-align">
+ Apache Fineract® (\'fīn-,ˌ,rakt\) is open source software
for financial services, designed to create a cloud-ready
Review Comment:
The original text which this replaces was:
> Apache Fineract® (\’fīn-,ә-,rakt\)
un-encoded that becomes:
> Apache Fineract® (\’fīn-,ә-,rakt\)
but this is:
> Apache Fineract® (\'fīn-,ˌ,rakt\)
It appears to me that the ә == ә character was lost here?
In order to avoid future problems with non Unicode compliant editors, how
about just still using the original HTML escape variant?
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
![https://static.scarf.sh/a.png?x-pxid=2067fdb9-816d-461c-8713-bfb6cd8bb098"](https://static.scarf.sh/a.png?x-pxid=2067fdb9-816d-461c-8713-bfb6cd8bb098"){kind=link}