0ct0pu5/Heimdall
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Changes to the tooltips

Browse source
This commit is contained in:
Kode 2022-03-15 19:08:10 +00:00
parent 8499d100ff
commit 1e35f83fed
5 changed files with 34 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
public/css/app.css vendored
View file

@ -1,4 +1,3 @@
@charset "UTF-8";
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
font-family: sans-serif;
@ -420,11 +419,12 @@ body {
text-align: center;
line-height: 30px;
display: none;
z-index: 1;
}
.item-container .tooltip {
padding: 25px;
border-radius: 5px;
background: #00000038;
background: #000000c8;
color: white;
position: absolute;
bottom: 120px;
@ -433,10 +433,15 @@ body {
font-size: 13px;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
display: none;
z-index: 0;
opacity: 0;
transform: translateY(-20px);
transition: all 0.3s;
}
.item-container:hover .tooltip {
display: block;
.item-container .tooltip.active {
transform: translateY(0);
opacity: 1;
z-index: 2;
}
.black {

5
public/js/app.js vendored
View file

@ -641,6 +641,11 @@ $.when($.ready).then(function () {
}
});
$('#sortable').sortable('disable');
$('#sortable').on('mouseenter', '.item', function () {
$(this).siblings('.tooltip').addClass('active');
}).on('mouseleave', '.item', function () {
$(this).siblings('.tooltip').removeClass('active');
});
$('#search-container').on('input', 'input[name=q]', function () {
var search = this.value;
var items = $('#sortable').children('.item-container');

4
public/mix-manifest.json generated
View file

@ -1,4 +1,4 @@
{
"/css/app.css": "/css/app.css?id=7de7134287f332b33a25",
"/js/app.js": "/js/app.js?id=d04c0e0d819506e10194"
"/css/app.css": "/css/app.css?id=af5899107a5ec84f0b3a",
"/js/app.js": "/js/app.js?id=39f89cbf3b7659f70528"
}

6
resources/assets/js/app.js
View file

@ -128,6 +128,12 @@ $.when( $.ready ).then(function() {
});
$('#sortable').sortable('disable');
$('#sortable').on('mouseenter', '.item', function () {
$(this).siblings('.tooltip').addClass('active')
}).on('mouseleave', '.item', function () {
$(this).siblings('.tooltip').removeClass('active')
})
$('#search-container').on('input', 'input[name=q]', function () {
const search = this.value
const items = $('#sortable').children('.item-container')

17
resources/assets/sass/_app.scss
View file

@ -200,11 +200,13 @@ body {
text-align: center;
line-height: 30px;
display: none;
z-index: 1;
}
.tooltip {
padding: 25px;
border-radius: 5px;
background: #00000038;
background: #000000c8;
color: white;
position: absolute;
bottom: 120px;
@ -212,11 +214,14 @@ body {
right: 0;
font-size: 13px;
backdrop-filter: blur(8px);
display: none;
}
&:hover {
.tooltip {
display: block;
z-index: 0;
opacity: 0;
transform: translateY(-20px);
transition: all 0.3s;
&.active {
transform: translateY(0);
opacity: 1;
z-index: 2;
}
}
}