mirror/mCaptcha
1
0
Fork 1
mirror of https://github.com/mCaptcha/mCaptcha.git synced 2026-02-13 11:05:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

dom manipulations uses elements

Browse Source
This commit is contained in:
realaravinth
2021-05-09 16:39:52 +05:30
parent cd729effb9
commit 686774a182
30 changed files with 262 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
templates/panel/navbar/index.html Normal file
View File

@@ -0,0 +1,86 @@
<nav class="secondary-menu">
<ul>
<li class="secondary-menu__heading">
<img class="secondary-menu__logo" src="<.= crate::FILES.get("./static-assets/img/icon-trans.png").unwrap() .>" alt="Logo" />
<div class="secondary-menu__brand-name">
mCaptcha
</div>
</li>
<!--
<li class="secondary-menu__section-partition"></li>
-->
<li class="secondary-menu__item">
<a class="secondary-menu__item-link" href="<.= crate::PAGES.home .>">
<img class="secondary-menu__icon" src="<.= crate::FILES.get("./static-assets/img/svg/home.svg").unwrap() .>" alt="" />
<div class="secondary-menu__item-name">
Overview
</div>
</a>
</li>
<li class="secondary-menu__item">
<a class="secondary-menu__item-link" href="<.= crate::PAGES.panel.sitekey.list .>">
<img class="secondary-menu__icon" src="<.= crate::FILES.get("./static-assets/img/svg/key.svg").unwrap() .>" alt="" />
<div class="secondary-menu__item-name">
Site Keys
</div>
</a>
</li>
<li class="secondary-menu__item">
<a class="secondary-menu__item-link" href="">
<img class="secondary-menu__icon" src="<.= crate::FILES.get("./static-assets/img/svg/settings.svg").unwrap() .>" alt="" />
<div class="secondary-menu__item-name">
Settings
</div>
</a>
</li>
<li class="secondary-menu__item">
<a class="secondary-menu__item-link" href="">
<img class="secondary-menu__icon" src="<.= crate::FILES.get("./static-assets/img/svg/credit-card.svg").unwrap() .>" alt="" />
<div class="secondary-menu__item-name">
Billing
</div>
</a>
</li>
<li class="secondary-menu__item">
<a class="secondary-menu__item-link" href="">
<img class="secondary-menu__icon" src="<.= crate::FILES.get("./static-assets/img/svg/help-circle.svg").unwrap() .>" alt="" />
<div class="secondary-menu__item-name">
Help
</div>
</a>
</li>
<li class="secondary-menu__item">
<a class="secondary-menu__item-link" href="">
<img
class="secondary-menu__icon"
src="<.= crate::FILES.get("./static-assets/img/svg/message-square.svg").unwrap() .>"
alt=""
/>
<div class="secondary-menu__item-name">
Support
</div>
</a>
</li>
<li class="secondary-menu__item">
<a class="secondary-menu__item-link" href="<.= crate::DOCS.home .>">
<img class="secondary-menu__icon" src="<.= crate::FILES.get("./static-assets/img/svg/file-text.svg").unwrap() .>" alt="" />
<div class="secondary-menu__item-name">
API Docs
</div>
</a>
</li>
<li class="secondary-menu__item">
<a class="secondary-menu__item-link" href="<.= crate::SETTINGS.source_code .>">
<img class="secondary-menu__icon"
src="<.= crate::FILES.get("./static-assets/img/svg/github.svg").unwrap() .>" alt="GitHub Icon" />
<div class="secondary-menu__item-name">
Source Code
</div>
</a>
</li>
</ul>
</nav>
<!-- Nav/Side/Secondary bar -->

17
templates/panel/navbar/index.ts Normal file
View File

@@ -0,0 +1,17 @@
/*
* Copyright (C) 2021 Aravinth Manivannan <realaravinth@batsense.net>
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
import './main.scss';

89
templates/panel/navbar/main.scss Normal file
View File

@@ -0,0 +1,89 @@
/*
* Copyright (C) 2021 Aravinth Manivannan <realaravinth@batsense.net>
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
@import '../../reset';
@import '../../vars';
.secondary-menu {
// position: fixed;
// width: 14%;
// left: 0;
// bottom: 0;
// top: 0;
// right: 0;
height: 100%;
overflow: auto;
background-color: $secondary-backdrop;
color: $light-text;
}
.secondary-menu__heading {
margin: auto;
padding: 20px 5px;
display: flex;
}
.secondary-menu__heading:hover {
color: $green;
cursor: grab;
}
.secondary-menu__logo {
width: 70px;
display: inline-block;
}
.secondary-menu__brand-name {
display: inline-block;
margin: auto;
font-size: 1.5rem;
}
.secondary-menu__item {
margin: auto;
padding: 20px 25px;
display: flex;
}
.secondary-menu__icon {
filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%)
contrast(103%);
opacity: 0.8;
width: 1rem;
margin: auto;
margin-right: 10px;
}
.secondary-menu__item-name {
display: inline-block;
margin: auto;
font-size: 1rem;
}
.secondary-menu__item-link:hover {
color: $green;
cursor: grab;
filter: invert(58%) sepia(60%) saturate(331%) hue-rotate(76deg)
brightness(91%) contrast(92%);
}
.secondary-menu__item-link {
color: inherit;
width: 100%;
height: 100%;
}