neosubhamoy/neosubhamoy-portfolio
1
1
Fork 0
mirror of https://github.com/neosubhamoy/neosubhamoy-portfolio.git synced 2025-12-19 23:59:35 +05:30
Code Issues Wiki Activity

(feat): added tooltips in flotingbar using popper.js and tippy.js

Browse Source
This commit is contained in:
Subhamoy Biswas
2023-12-15 22:21:50 +05:30
parent eff59807a4
commit 42f865f543
10 changed files with 67 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
htdocs/assets/_integrate.php
View File

@@ -3,8 +3,11 @@
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Upright&family=Lexend+Deca:wght@100;300;400&family=Poppins&display=swap" rel="stylesheet">
<link rel="stylesheet" href="assets/style.css">
<link rel="stylesheet" href="assets/extra-style.css">
<link rel="stylesheet" href="https://unpkg.com/tippy.js@6/animations/shift-away.css">
<link rel="icon" type="image/x-icon" href="assets/images/favicon.ico">
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/js/all.min.js" integrity="sha512-uKQ39gEGiyUJl4AI6L+ekBdGKpGw4xJ55+xyJG7YFlJokPNYegn9KwQ3P8A7aFQAUtUsAQHep+d/lrGqrbPIDQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" crossorigin="anonymous"></script>
<script src="https://cdn.lordicon.com/lordicon-1.2.0.js"></script>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script src="https://unpkg.com/@popperjs/core@2"></script>
<script src="https://unpkg.com/tippy.js@6"></script>

20
htdocs/assets/extra-style.css
View File

@@ -272,3 +272,23 @@ background: #38BDF8;
}
}
}
/* --- Tooltip Styling --- */
.tippy-box[data-theme~='neosubhamoy'] {
background-color: #1b2536;
color: #FFFFFF;
}
.tippy-box[data-theme~='neosubhamoy'][data-placement^='top'] > .tippy-arrow::before {
border-top-color: #1b2536;
}
.tippy-box[data-theme~='neosubhamoy'][data-placement^='bottom'] > .tippy-arrow::before {
border-bottom-color: #1b2536;
}
.tippy-box[data-theme~='neosubhamoy'][data-placement^='left'] > .tippy-arrow::before {
border-left-color: #1b2536;
}
.tippy-box[data-theme~='neosubhamoy'][data-placement^='right'] > .tippy-arrow::before {
border-right-color: #1b2536;
}

36
htdocs/assets/js/tippy-config.js Normal file
View File

@@ -0,0 +1,36 @@
//--- controls tooltips and popover elements
tippy('#searchbar', {
content: "ALT + K",
theme: 'neosubhamoy',
animation: 'shift-away',
delay: 500,
touch: false
});
tippy('#sharebutton', {
content: "ALT + L",
theme: 'neosubhamoy',
animation: 'shift-away',
delay: 500,
touch: false
});
tippy('#closebutton', {
content: "ESC",
placement: 'right',
theme: 'neosubhamoy',
animation: 'shift-away',
delay: 500,
touch: false
});
tippy('#shareclosebutton', {
content: "ESC",
placement: 'right',
theme: 'neosubhamoy',
animation: 'shift-away',
delay: 500,
touch: false
});

1
htdocs/blog.php
View File

@@ -34,5 +34,6 @@ require 'core/query_functions.php';
<script type="text/javascript" src="assets/js/preloader-config.js"></script>
<script type="text/javascript" src="assets/js/floatingbar-config.js"></script>
<script type="text/javascript" src="assets/js/keybinding-config.js"></script>
<script type="text/javascript" src="assets/js/tippy-config.js"></script>
</body>
</html>

1
htdocs/contact.php
View File

@@ -116,6 +116,7 @@ require 'core/query_functions.php';
<script type="text/javascript" src="assets/js/preloader-config.js"></script>
<script type="text/javascript" src="assets/js/floatingbar-config.js"></script>
<script type="text/javascript" src="assets/js/keybinding-config.js"></script>
<script type="text/javascript" src="assets/js/tippy-config.js"></script>
<script type="text/javascript" src="assets/js/core-animation.js"></script>
<script type="text/javascript" src="assets/js/contactform-config.js"></script>
</body>

1
htdocs/dmca.php
View File

@@ -62,5 +62,6 @@ require 'core/query_functions.php';
<script type="text/javascript" src="assets/js/preloader-config.js"></script>
<script type="text/javascript" src="assets/js/floatingbar-config.js"></script>
<script type="text/javascript" src="assets/js/keybinding-config.js"></script>
<script type="text/javascript" src="assets/js/tippy-config.js"></script>
</body>
</html>

1
htdocs/home.php
View File

@@ -224,6 +224,7 @@ require 'core/query_functions.php';
<script type="text/javascript" src="assets/js/preloader-config.js"></script>
<script type="text/javascript" src="assets/js/floatingbar-config.js"></script>
<script type="text/javascript" src="assets/js/keybinding-config.js"></script>
<script type="text/javascript" src="assets/js/tippy-config.js"></script>
<script type="text/javascript" src="assets/js/core-animation.js"></script>
</body>
</html>

1
htdocs/policy.php
View File

@@ -277,5 +277,6 @@ require 'core/query_functions.php';
<script type="text/javascript" src="assets/js/preloader-config.js"></script>
<script type="text/javascript" src="assets/js/floatingbar-config.js"></script>
<script type="text/javascript" src="assets/js/keybinding-config.js"></script>
<script type="text/javascript" src="assets/js/tippy-config.js"></script>
</body>
</html>

1
htdocs/projects.php
View File

@@ -191,5 +191,6 @@ $years = create_project_years_array($conn);
<script type="text/javascript" src="assets/js/preloader-config.js"></script>
<script type="text/javascript" src="assets/js/floatingbar-config.js"></script>
<script type="text/javascript" src="assets/js/keybinding-config.js"></script>
<script type="text/javascript" src="assets/js/tippy-config.js"></script>
</body>
</html>

1
htdocs/terms.php
View File

@@ -190,5 +190,6 @@ require 'core/query_functions.php';
<script type="text/javascript" src="assets/js/preloader-config.js"></script>
<script type="text/javascript" src="assets/js/floatingbar-config.js"></script>
<script type="text/javascript" src="assets/js/keybinding-config.js"></script>
<script type="text/javascript" src="assets/js/tippy-config.js"></script>
</body>
</html>