Declutter Aliases - show them only when needed (snippet for version 1.8 is in post #16)

liberated_potato · October 26, 2021, 8:07pm

Not sure what is going on in your case. I guess, you have selected the language of the code snippet as css right? What about the possibility of some higher checkbox disabling this particular snippet?
Is it not working in the case you have shown in your screenshot or is it not working at all?

Dante_Gaxiola · October 27, 2021, 7:36am

I don’t know what happened, but started working after restarting the program. Thanks a lot! I really appreciate it!

hannesfrank · December 8, 2021, 4:39pm

@liberated_potato CSS from the first topic should work again:

Basic Hiding

/* Hide aliases unless parent of the alias is zoomed in */
.tree-node-container .tree-node-container [data-rem-container-tags~="aliases"] {
   display : none;
}  

/* Hide aliases also inside full hover preview of references */
#document-hover-preview__popup .tree-node-container [data-rem-container-tags~="aliases"] {
display: none;
}

Some more variations

Single line

[data-rem-container-tags~="aliases"] > .TreeNode {
  display: flex;
  flex-wrap: wrap;
}

New Icon

[data-rem-container-tags~="aliases"] > .TreeNode .rem-powerup-icon svg {
  display: none;
}

[data-rem-container-tags~="aliases"] > .TreeNode .rem-powerup-icon::before {
  display: block;
  width: 18px;
  height: 24px;
  content: "";
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml; utf8, <svg fill='%23444' xmlns='http://www.w3.org/2000/svg'  viewBox='-2 -1 20 20'><path d='M2.92 6.80688C3.68 6.80688 4.36 6.50688 4.88 6.03688L9.09 8.29688C9.04 8.52688 9 8.75688 9 8.99688C9 9.23688 9.04 9.46688 9.09 9.69688L5.04 12.31C4.5 11.81 3.79 11.5 3 11.5C1.34 11.5 0 12.84 0 14.5C0 16.16 1.34 17.5 3 17.5C4.66 17.5 6 16.16 6 14.5C6 14.26 5.96 14.03 5.91 13.8L9.96 11.1869C10.5 11.6869 11.21 11.9969 12 11.9969C13.66 11.9969 15 10.6569 15 8.99688C15 7.33688 13.66 5.99688 12 5.99688C11.21 5.99688 10.5 6.30688 9.96 6.80688L5.76 4.53688C5.81 4.32688 5.84 4.10688 5.84 3.88688C5.84 2.27688 4.53 0.9669 2.92 0.9669C1.31 0.9669 0 2.27688 0 3.88688C0 5.49688 1.31 6.80688 2.92 6.80688ZM3 15.5C2.45 15.5 2 15.05 2 14.5C2 13.95 2.45 13.5 3 13.5C3.55 13.5 4 13.95 4 14.5C4 15.05 3.55 15.5 3 15.5ZM12 7.99688C12.55 7.99688 13 8.44688 13 8.99688C13 9.54688 12.55 9.99688 12 9.99688C11.45 9.99688 11 9.54688 11 8.99688C11 8.44688 11.45 7.99688 12 7.99688ZM2.92 2.8669C3.47 2.8669 3.92 3.31688 3.92 3.86688C3.92 4.41688 3.47 4.86688 2.92 4.86688C2.37 4.86688 1.92 4.41688 1.92 3.86688C1.92 3.31688 2.37 2.8669 2.92 2.8669Z'></path><rect x='8.5' y='5.5' width='7' height='7' rx='3.5'></rect></svg>");
}

No numbers

/* Hide the powerup icon before each Alias */
[data-rem-container-tags~="aliases"] > .TreeNode .rem-powerup-icon {
  display: none;
}

[data-rem-container-tags~="aliases"] > .TreeNode > .tree-node-container > .tree-node--parent .rem-bullet__number > div { display: none; }
[data-rem-container-tags~="aliases"] > .TreeNode > .tree-node-container > .tree-node--parent .rem-bullet__number::before {
  display: block;
  width: 18px;
  height: 24px;
  content: "";
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml; utf8, <svg fill='%23444' xmlns='http://www.w3.org/2000/svg'  viewBox='-2 -1 20 20'><path d='M2.92 6.80688C3.68 6.80688 4.36 6.50688 4.88 6.03688L9.09 8.29688C9.04 8.52688 9 8.75688 9 8.99688C9 9.23688 9.04 9.46688 9.09 9.69688L5.04 12.31C4.5 11.81 3.79 11.5 3 11.5C1.34 11.5 0 12.84 0 14.5C0 16.16 1.34 17.5 3 17.5C4.66 17.5 6 16.16 6 14.5C6 14.26 5.96 14.03 5.91 13.8L9.96 11.1869C10.5 11.6869 11.21 11.9969 12 11.9969C13.66 11.9969 15 10.6569 15 8.99688C15 7.33688 13.66 5.99688 12 5.99688C11.21 5.99688 10.5 6.30688 9.96 6.80688L5.76 4.53688C5.81 4.32688 5.84 4.10688 5.84 3.88688C5.84 2.27688 4.53 0.9669 2.92 0.9669C1.31 0.9669 0 2.27688 0 3.88688C0 5.49688 1.31 6.80688 2.92 6.80688ZM3 15.5C2.45 15.5 2 15.05 2 14.5C2 13.95 2.45 13.5 3 13.5C3.55 13.5 4 13.95 4 14.5C4 15.05 3.55 15.5 3 15.5ZM12 7.99688C12.55 7.99688 13 8.44688 13 8.99688C13 9.54688 12.55 9.99688 12 9.99688C11.45 9.99688 11 9.54688 11 8.99688C11 8.44688 11.45 7.99688 12 7.99688ZM2.92 2.8669C3.47 2.8669 3.92 3.31688 3.92 3.86688C3.92 4.41688 3.47 4.86688 2.92 4.86688C2.37 4.86688 1.92 4.41688 1.92 3.86688C1.92 3.31688 2.37 2.8669 2.92 2.8669Z'></path><rect x='8.5' y='5.5' width='7' height='7' rx='3.5'></rect></svg>");
}

hugo · July 14, 2022, 12:54pm

Is there a way of making it work in RemNote 1.8?

Dante_Gaxiola · July 15, 2022, 5:21am

Yes, would be great to make it work in 1.8, please!

liberated_potato · July 16, 2022, 6:39pm

@hugo @Dante_Gaxiola
Here is the updated snippet for 1.8 version. I did some testing and it looks good. Let me know if you find any issues.


/* Hide the aliases container if it is inside a child */
.tree-node--children [data-rem-container-tags~="aliases"] {
    display : none;
 }  

  /* Hide the aliases container if it is inside a reference context menu (the one you get when you hover over a rem reference) */
 .rn-popup__content [data-rem-container-tags~="aliases"] {
    display : none;
 }

hugo · July 17, 2022, 11:51am

Thanks a lot!!! It is working.

Dante_Gaxiola · August 2, 2022, 7:31pm

Hi, man, it worked perfectly, thanks so much!

anisha · August 4, 2022, 9:14am

Is there a newer version of these for the current version (1.8.x)? I was using all of these, but they do not seem to work anymore

anisha · August 4, 2022, 11:45am

Thanks so much for this!
This was working for me in versions before 1.8.10, but doesn’t seem to be working in the newer versions.
Anyone else?

Dante_Gaxiola · August 6, 2022, 3:40am

It seems to be working just fine for me (1.8.13), in web (WPA). Maybe if you close and open the program? Make sure you are using the updated snippet and the old one is turned off or deleted, and you don’t have other opposing codes, maybe…

liberated_potato · August 6, 2022, 5:54am

It is still working for me as well. Most likely you have other conflicting CSS code. Try to disable all other CSS snippets, just enable this one and see if it works.

There can be one more weird reason for this to not work. At least for me, the custom CSS got messed up after the recent update. Now, I have two custom CSS powerup pages. One such page is empty and the other one has all my old CSS snippets. If I add anything to this old Custom CSS page, it doesn’t work. However, if I add anything to the new Custom CSS page, it works. To open this new Custom CSS page, you have to go to Interface in Settings and click Add Custom CSS. Try adding this snippet to the new Custom CSS page.

hugo · August 6, 2022, 11:29am

It is still working for me also.

anisha · August 6, 2022, 12:13pm

@Dante_Gaxiola @liberated_potato @hugo Thank you all!
No conflicts, just had to move them under a new parent > Disable them all > Enable them again and it seemed to fix itself (in case anyone else comes across the same problem).

Dante_Gaxiola · August 9, 2022, 8:48pm

Well, oddly enough, it stopped working for me today, with no changes on my part. RN version is 1.8.14. I tried @anisha method and didn’t work. Anyone else?

anisha · August 10, 2022, 5:57am

Yep, stopped working for me as well on the web (1.8.14). Works fine on the desktop app, which is still running 1.8.13.

hugo · August 10, 2022, 7:07pm

Same for me. Not working since 1.8.14.

alad93 · August 10, 2022, 8:37pm

yep yep, not working since 1.8.14. it’s amazing the visual difference this makes, this snippet is so so useful

Dante_Gaxiola · August 11, 2022, 11:27pm

Maybe @liberated_potato or @hannesfrank could help us here, would be very appreciated!

liberated_potato · August 20, 2022, 2:48am

Unfortunately, I don’t see a way to differentiate aliases anymore. There used to be this [data-rem-container-tags~="aliases"] that we could use to differentiate aliases. I don’t see them anymore. I don’t think I will be able to fix it unless there is some change in the Remnote code base or someone else finds some CSS magic.
@hannesfrank any insights?