glax/Tranga-Website
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Compare commits

base: glax:ddee459aa2072dbc90db28f6bb816252a5da4e20
Branches Tags
glax:master
glax:cuttingedge
glax:frontend-v2
glax:dev
..
compare: glax:6952bcaa1d1d797ad60b15dd490e90906cdbd818
Branches Tags
glax:cuttingedge
glax:master
glax:frontend-v2
glax:dev

No commits in common. "ddee459aa2072dbc90db28f6bb816252a5da4e20" and "6952bcaa1d1d797ad60b15dd490e90906cdbd818" have entirely different histories.
ddee459aa2 ... 6952bcaa1d

3 changed files with 19 additions and 31 deletions
Show Stats Expand all files Collapse all files

2
Website/interaction.js
View File

@ -219,10 +219,10 @@ function CreateManga(manga, connector){
statusTooltip.innerText = 'Status Unavailable'; statusTooltip.innerText = 'Status Unavailable';
} }
releaseStatus.appendChild(statusTooltip); //Append the tooltip to the indicator circle releaseStatus.appendChild(statusTooltip); //Append the tooltip to the indicator circle
mangaName.appendChild(releaseStatus); //Append the release status indicator to the info block
info.appendChild(mangaName); info.appendChild(mangaName);
mangaElement.appendChild(info); mangaElement.appendChild(info);
mangaElement.appendChild(releaseStatus); //Append the release status indicator to the publication element
return mangaElement; return mangaElement;
} }

24
Website/styles/style_default.css
View File

@ -251,16 +251,13 @@ publication-name{
} }
publication-status { publication-status {
display:block; display: inline-block;
height: 10px; height: 10px;
width: 10px; width: 10px;
border-radius: 50%; border-radius: 50%;
margin: 5px; margin: 5px;
position: absolute; position: relative;
top: 5px; vertical-align: middle;
right: 5px;
z-index: 2;
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 10px, rgb(51, 51, 51) 0px 0px 10px 3px;
} }
publication-status:hover > status-tooltip { publication-status:hover > status-tooltip {
@ -272,8 +269,8 @@ status-tooltip {
position: absolute; position: absolute;
/*Position*/ /*Position*/
left: 150%; left: -50px ;
bottom: -75%; bottom: 150%;
z-index: 3; z-index: 3;
/*Text Properties*/ /*Text Properties*/
@ -287,20 +284,17 @@ status-tooltip {
width:100px; width:100px;
background-color: black; background-color: black;
border-radius: 6px; border-radius: 6px;
border-style: solid;
border-color: black;
border-width: 1px;
} }
status-tooltip::after { status-tooltip::after {
content: " "; content: " ";
position: absolute; position: absolute;
top: 50%; top: 100%; /* At the bottom of the tooltip */
right: 100%; /* To the left of the tooltip */ left: 50%;
margin-top: -5px; margin-left: -5px;
border-width: 5px; border-width: 5px;
border-style: solid; border-style: solid;
border-color: transparent black transparent transparent; border-color: black transparent transparent transparent;
} }
publication img { publication img {

24
Website/styles/style_mangahover.css
View File

@ -252,16 +252,13 @@ publication-name{
} }
publication-status { publication-status {
display:block; display: inline-block;
height: 10px; height: 10px;
width: 10px; width: 10px;
border-radius: 50%; border-radius: 50%;
margin: 5px; margin: 5px;
position: absolute; position: relative;
top: 5px; vertical-align: middle;
right: 5px;
z-index: 2;
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 10px, rgb(51, 51, 51) 0px 0px 10px 3px;
} }
publication-status:hover > status-tooltip { publication-status:hover > status-tooltip {
@ -273,8 +270,8 @@ status-tooltip {
position: absolute; position: absolute;
/*Position*/ /*Position*/
left: 150%; left: -50px ;
bottom: -75%; bottom: 150%;
z-index: 3; z-index: 3;
/*Text Properties*/ /*Text Properties*/
@ -288,20 +285,17 @@ status-tooltip {
width:100px; width:100px;
background-color: black; background-color: black;
border-radius: 6px; border-radius: 6px;
border-style: solid;
border-color: black;
border-width: 1px;
} }
status-tooltip::after { status-tooltip::after {
content: " "; content: " ";
position: absolute; position: absolute;
top: 50%; top: 100%; /* At the bottom of the tooltip */
right: 100%; /* To the left of the tooltip */ left: 50%;
margin-top: -5px; margin-left: -5px;
border-width: 5px; border-width: 5px;
border-style: solid; border-style: solid;
border-color: transparent black transparent transparent; border-color: black transparent transparent transparent;
} }