hangar-tech/biofriction-web
hangar-tech
/
biofriction-web
Archived
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

created tag cloud view on hover

This commit is contained in:
jorge 2021-09-28 15:05:18 +02:00
parent de740b0198
commit ac71f86c11
3 changed files with 31 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
biofriction-theme/dist/assets/css/app.css vendored
View File

File diff suppressed because one or more lines are too long

1
biofriction-theme/header.php
View File

@ -31,6 +31,7 @@
</content> </content>
<aside class="bfr_category_tags"> <aside class="bfr_category_tags">
<h6 class="button primary hollow">#tags</h6>
<div class="bfr_all_tags bfr_toogled_tags"> <div class="bfr_all_tags bfr_toogled_tags">
<?php if (is_category('peephole') || is_tag() ) : ?> <?php if (is_category('peephole') || is_tag() ) : ?>
<?php wp_tag_cloud( 'unit=rem&smallest=1&largest=1&number=0&orderby=name' ); ?> <?php wp_tag_cloud( 'unit=rem&smallest=1&largest=1&number=0&orderby=name' ); ?>

39
biofriction-theme/src/assets/scss/components/_tags.scss
View File

@ -1,5 +1,9 @@
.bfr_category_tags { .bfr_category_tags {
font-family: $header-font-family; font-family: $header-font-family;
position: relative;
top:-1rem;
text-align: center;
z-index: 100;
.tag-cloud-link::before { .tag-cloud-link::before {
content: '#'; content: '#';
// display: inline-block; // display: inline-block;
@ -12,28 +16,17 @@
background-color:$secondary-color; background-color:$secondary-color;
} }
} }
.bfr_toogled_tags{
display:none;
position:absolute;
padding:3rem;
border-radius: 2rem;
margin-top:-1rem;
background-color: rgba(255,255,255,0.95);
}
.button:hover+.bfr_toogled_tags,.bfr_toogled_tags:hover {
display:block;
}
} }
.bfr_category_tags{
width: 6rem;
height:2.5rem;
overflow: hidden;
&::before{
display: inline-block;
content: '#tags';
width: 6rem;
height: 2.5rem;
border-radius: 2rem;
border: 2px solid green;
padding: 0.3rem 1rem;
}
&:hover{
width: auto;
height: auto;
overflow: unset;
border-radius: 2rem;
background-color: rgba(250,250,250,0.8);
display:inline;
position:absolute;
}
}