Block everything except "THIS" element

edited May 2008 in Stylish
I want to block all the items in a page except tp this item: chipmark.com#DIV(id=manage_container) how do I do that?

Thanks


edit (May 7th 2008):
title is now: Block everything except "THIS" element (before: Block everything excapt...)
lol only now I just notice "excapt" (= except)
«1

Comments

  • edited May 2008
    *:not(#manage_container){display:none!important}

    edit:actually that'll probably block everything since it doesnt do :not for the parents of #manage_container
    what page do i find #manage_container on?
  • only that pluginManage page has #manage_container but hiding the other stuff doesnt make a difference i can see (unless im already blocking whatever it is)
    what are you trying to hide?
  • edited May 2008
    ALL except this:

    image
  • oops forgot about noscript
    @namespace url(http://www.w3.org/1999/xhtml); @-moz-document domain("chipmark.com"){ #mainbox_mm>*:not([style]), #mainbox_mm>table>tbody>tr>td[style], body>center>table>tbody>tr>td>table:not([style="table-layout: fixed;"]){display:none!important} }
  • so, I guess, there is no way to expand this item more than 402px height?
  • Speaking of NOT, is there a way to exclude a subdomain/url ?
    I'll like to do something like that :

    @-moz-document domain(google.com),
    !url-prefix(http://www.google.com/calendar)

    where ! means 'NOT'.
  • something like so?
    @namespace url(http://www.w3.org/1999/xhtml); @-moz-document domain("chipmark.com"){ #mainbox_ul,#mainbox_um,#mainbox_ur,#mainbox_ll,#mainbox_lm,#mainbox_lr, #mainbox_mm>*:not([style]), #mainbox_mm>table>tbody>tr>td[style], body>center>table>tbody>tr>td>table:not([style="table-layout: fixed;"]){display:none!important} #imageContainer{position:absolute!important;right:0!important;bottom:0!important} #manage_container{position:absolute!important;left:0!important;top:0!important;width:95%!important;max-height:none!important;height:95%!important} #manage_tree_div, #manage_panes{max-height:none!important;height:94%!important;max-height:95%!important} /*hide chipmark/label overflow*/ #manage_tree_div{overflow-x:hidden!important} }

    @Agnelo your not the first person to want that but unless mozilla adds support then your out of luck
  • ChoGGi!! Thank you so much :D

    It looks pretty funny though:

    image image

    also, the limits looks kinda fake?! (but it still great)
    any chance to "take back" the white background
    support@chipmark.com wrote:The nice thing about blummets and grease monkey scripts is that anyone can create them. If a user chooses to create either of these and would like it to be "officially supported" by Chipmark, that may be something we could consider.
    WOW! thanks man ^_^
  • edited May 2008
    How to make this work with both URLs?
    https://www.chipmark.com/Manage
    https://www.chipmark.com/Main?target=pluginManage
    @namespace url(http://www.w3.org/1999/xhtml); @-moz-document url("https://www.chipmark.com/Manage") { #mainbox_ul,#mainbox_um,#mainbox_ur,#mainbox_ll,#mainbox_lm,#mainbox_lr, #mainbox_mm>*:not([style]), #mainbox_mm>table>tbody>tr>td[style], body>center>table>tbody>tr>td>table:not([style="table-layout: fixed;"]){display:none!important} #imageContainer{position:absolute!important;right:0!important;bottom:0!important} #manage_container{position:absolute!important;left:0!important;top:0!important;width:95%!important;max-height:none!important;height:95%!important} #manage_tree_div, #manage_panes{max-height:none!important;height:94%!important;max-height:95%!important} /*hide chipmark/label overflow*/ #manage_tree_div{overflow-x:hidden!important} }
  • had a bit of fun see if you like it (also added the urls)
    @namespace url(http://www.w3.org/1999/xhtml); @-moz-document url("https://www.chipmark.com/Manage"),url("https://chipmark.com/Manage"),url("https://www.chipmark.com/Main?target=pluginManage"),url("https://chipmark.com/Main?target=pluginManage"){ #mainbox_ul,#mainbox_um,#mainbox_ur,#mainbox_ll,#mainbox_lm,#mainbox_lr, #mainbox_mm>*:not([style]), #mainbox_mm>table>tbody>tr>td[style], body>center>table>tbody>tr>td>table:not([style="table-layout: fixed;"]){display:none!important} #manage_bar{width:auto!important;position:fixed!important;left:20%!important;bottom:0!important;top:auto!important;-moz-border-radius:4pt!important;border:1pt #999 solid!important} #manage_status_bar{padding:3pt!important;width:auto!important;position:fixed!important;right:5pt!important;bottom:5em!important;background-color:#FFCC33!important;color:#000!important;-moz-border-radius:4pt!important} #imageContainer{position:absolute!important;right:1em!important;bottom:2em!important} #manage_container{position:absolute!important;left:0!important;top:0!important;width:95%!important;max-height:none!important;height:100%!important} #manage_tree_div, #manage_list, #manage_panes{max-height:none!important;height:100%!important;max-height:none!important} /*hide chipmark/label overflow*/ #manage_tree_div{overflow-x:hidden!important} #manage_container, #manage_container *{border-bottom-color:transparent!important} }
  • edited May 2008
    Can you see the different? (except the colors)

    https://www.chipmark.com/Manage
    image

    https://www.chipmark.com/Main?target=pluginManage
    image


    btw, the orange balloon (or whatever it is) is very stylish :D
    -- and yes, I know that this "stylish" compliment was told, not once, before...

    thank you thank you thank you, it is not perfect, and yet a very satisfying stylish!
  • edited May 2008
    sorry, wrong snapshot! (the 2nd image)

    this is the right one of https://www.chipmark.com/Main?target=pluginManage
    image

    the different isn't that much...
  • oh oops forgot about that, stick this in it somewhere
    body{background-color:#FFF!important}
  • edited May 2008
    first of all: Dude!! you're the man!!

    2nd: updated

    3rd: um, do you own a Chipmark account? if not, why are you doing this?

    I don't want to be sound selfish, so?!?
    Is it possible to expand the right column (just like the one on the left side)?

    image

    Thank you so much!

    edit: http://www.chipmark.com:8082/forum/comments.php?DiscussionID=150
  • um, do you own a Chipmark account? if not, why are you doing this?
    nope no chipmark account. its entertaining i suppose

    if you dont want the new stuff just use the color/height fix instead of body{background-color:#FFF!important} from before
    @namespace url(http://www.w3.org/1999/xhtml); @-moz-document url("https://www.chipmark.com/Manage"),url("https://chipmark.com/Manage"),url("https://www.chipmark.com/Main?target=pluginManage"),url("https://chipmark.com/Main?target=pluginManage"){ /*color/height fix*/ html,body{overflow:hidden!important;background-color:#FFF!important;height:auto!important} /*hide extra stuff*/ #mainbox_ul,#mainbox_um,#mainbox_ur,#mainbox_ll,#mainbox_lm,#mainbox_lr, #mainbox_mm>*:not([style]), #mainbox_mm>table>tbody>tr>td[style], body>center>table>tbody>tr>td>table:not([style="table-layout: fixed;"]){display:none!important} /*postion/resize*/ #manage_bar{width:auto!important;position:fixed!important;left:20%!important;bottom:0!important;top:auto!important} #manage_status_bar{padding:3pt!important;width:auto!important;position:fixed!important;right:5pt!important;bottom:5em!important;background-color:#FFCC33!important;color:#000!important;-moz-border-radius:4pt!important} #imageContainer{position:absolute!important;right:1em!important;bottom:2em!important} #manage_container{position:absolute!important;left:0!important;top:0!important;width:100%!important;max-height:none!important;height:100%!important} #manage_tree_div,#manage_list,#manage_panes{max-height:none!important;height:100%!important} /*hide chipmark/label overflow*/ #manage_tree_div{overflow-x:hidden!important} #manage_container, #manage_container *{border-bottom-color:transparent!important} /*loading box*/ #manage_loading{position:absolute!important;left:40%!important;bottom:5%!important;width:410px!important;height:424px!important;min-height:0!important;min-width:0!important} #manage_loading_status{color:#CC9933!important} #manage_progress_fill{background-color:#333399!important} }
  • Oh, that's better :) thanks!, and I meant to the height.

    when you said (wrote) "new style", did you meant to the white background? the white background is great!
    I didn't applied this on the last snapshot cause the grey background helped me to emphasize what I was talking about then.
  • edited May 2008
    not exactly sure what you mean, but what i meant was if you didn't want the new additions i made then just change
    body{background-color:#FFF!important}
    to
    html,body{background-color:#FFF!important;height:auto!important}
    that'll fix the gray bg and the item list not expanding

    btw the changes aren't too big just a couple things here n there, btw heres some hover effects for the manage buttons/chipmark item buttons (i needed to change the #manage_bar code so i just posted the whole style again)
    @namespace url(http://www.w3.org/1999/xhtml); @-moz-document url("https://www.chipmark.com/Manage"),url("https://chipmark.com/Manage"),url("https://www.chipmark.com/Main?target=pluginManage"),url("https://chipmark.com/Main?target=pluginManage"){ /*color/height fix*/ html,body{overflow:hidden!important;background-color:#FFF!important;height:auto!important} /*hide extra stuff*/ #mainbox_ul,#mainbox_um,#mainbox_ur,#mainbox_ll,#mainbox_lm,#mainbox_lr, #mainbox_mm>*:not([style]), #mainbox_mm>table>tbody>tr>td[style], body>center>table>tbody>tr>td>table:not([style="table-layout: fixed;"]){display:none!important} /*postion/resize*/ #manage_bar{width:auto!important;position:fixed!important;left:20%!important;bottom:0!important;top:auto!important;max-height:none!important;height:auto!important;background-color:#EAEAEA!important} #manage_status_bar{padding:3pt!important;width:auto!important;position:fixed!important;right:5pt!important;bottom:5em!important;background-color:#FFCC33!important;color:#000!important;-moz-border-radius:4pt!important} #imageContainer{position:absolute!important;right:1em!important;bottom:2em!important} #manage_container{position:absolute!important;left:0!important;top:0!important;width:100%!important;max-height:none!important;height:100%!important} #manage_tree_div,#manage_list,#manage_list_div,#manage_panes{max-height:none!important;height:100%!important} /*hide chipmark/label overflow*/ #manage_tree_div{overflow-x:hidden!important} #manage_container, #manage_container *{border-bottom-color:transparent!important} /*loading box*/ #manage_loading{position:absolute!important;left:40%!important;bottom:5%!important;width:410px!important;height:424px!important;min-height:0!important;min-width:0!important} #manage_loading_status{color:#CC9933!important} #manage_progress_fill{background-color:#333399!important} /*manage bar buttons*/ #manage_bar td{padding:0!important} .manage_bar_actions{padding:4pt!important;display:block!important} a.manage_bar_actions:hover{background-color:#FFCC33!important;color:#000!important} /*chipmark item buttons*/ .action_menu{padding:4pt 0!important;width:10em!important;text-align:center!important;display:block!important;-moz-border-radius:4pt!important} a.action_menu:hover{background-color:#FFCC33!important;color:#000!important} }
  • Bug, scrolling... only with the middle-click

    image image
  • edited May 2008
    the bug is on both of the URLs when middle-clicking, the scroll-bar is gone!

    the new hover effects is very cool!

    I can't sort my chipmarks...
  • edited May 2008
    sorting fix
    #manage_sort_menu{bottom:8em!important;top:auto!important;max-height:none!important}

    edit:
    actually its only kind of gone thats what happens when you use position:absolute (it doesnt move when you scroll). its just that now the div is filling the whole screen
  • why you chose to put the Toolbar is on the bottom anyway?
  • no real reason you want it at the top?
  • dunno, maybe I'll submit another stylish (one down and another on top)
  • to put it back at the top remove this line
    #manage_bar{width:auto!important;position:fixed!important;left:20%!important;bottom:0!important;top:auto!important;max-height:none!important;height:auto!important;background-color:#EAEAEA!important}

    found a bug i made (the bottom of the sort menu is gone)
    change
    #manage_container *{border-bottom-color:transparent!important}
    to
    #manage_container *:not(#manage_sort_menu){border-bottom-color:transparent!important}

    not sure if this is from me or not but add
    #manage_sort_menu{max-height:none!important}
    so the sort menu background isnt cut off
  • edited May 2008
    Finally Online :D

    line 16: removed
    #manage_bar{width:auto!important;position:fixed!important;left:20%!important;bottom:0!important;top:auto!important;max-height:none!important;height:auto!important;background-color:#EAEAEA!important}
    line 24 (line 25 before removing 16): changed to
    #manage_container *:not(#manage_sort_menu){border-bottom-color:transparent!important}
    no change... the sort of is still ineptly/misplaced ckick here
    #manage_sort_menu{max-height:none!important}
    the following code after your changes, without #manage_sort_menu{max-height:none!important}
    @namespace url(http://www.w3.org/1999/xhtml); @-moz-document url("https://www.chipmark.com/Manage"),url("https://chipmark.com/Manage"),url("https://www.chipmark.com/Main?target=pluginManage"),url("https://chipmark.com/Main?target=pluginManage"){ #manage_sort_menu{bottom:8em!important;top:auto!important;max-height:none!important} /*color/height fix*/ html,body{overflow:hidden!important;background-color:#FFF!important;height:auto!important} /*hide extra stuff*/ #mainbox_ul,#mainbox_um,#mainbox_ur,#mainbox_ll,#mainbox_lm,#mainbox_lr, #mainbox_mm>*:not([style]), #mainbox_mm>table>tbody>tr>td[style], body>center>table>tbody>tr>td>table:not([style="table-layout: fixed;"]){display:none!important} /*postion/resize*/ #manage_status_bar{padding:3pt!important;width:auto!important;position:fixed!important;right:5pt!important;bottom:5em!important;background-color:#FFCC33!important;color:#000!important;-moz-border-radius:4pt!important} #imageContainer{position:absolute!important;right:1em!important;bottom:2em!important} #manage_container{position:absolute!important;left:0!important;top:0!important;width:100%!important;max-height:none!important;height:100%!important} #manage_tree_div,#manage_list,#manage_panes{max-height:none!important;height:100%!important} /*hide chipmark/label overflow*/ #manage_tree_div{overflow-x:hidden!important} #manage_container, #manage_container *:not(#manage_sort_menu){border-bottom-color:transparent!important} /*loading box*/ #manage_loading{position:absolute!important;left:40%!important;bottom:5%!important;width:410px!important;height:424px!important;min-height:0!important;min-width:0!important} #manage_loading_status{color:#CC9933!important} #manage_progress_fill{background-color:#333399!important} /*manage bar buttons*/ #manage_bar td{padding:0!important} .manage_bar_actions{padding:4pt!important;display:block!important} a.manage_bar_actions:hover{background-color:#FFCC33!important;color:#000!important} /*chipmark item buttons*/ .action_menu{padding:4pt 0!important;width:10em!important;text-align:center!important;display:block!important;-moz-border-radius:4pt!important} a.action_menu:hover{background-color:#FFCC33!important;color:#000!important} }
  • not that is bothers me, but why you're not using these?
  • line 4#manage_sort_menu{bottom:8em!important;top:auto!important;max-height:none!important}
    replace with #manage_sort_menu{max-height:none!important}
    perfect!
  • before:

    after: where is the corner?
  • edited May 2008
    you'll need this (stick it near the bottom to override the other rule with #manage_panes{max-height
    #manage_panes{max-height:95%!important}
    or see how the below works for you

    took your edit of my style from above and changed more stuff around
    @namespace url(http://www.w3.org/1999/xhtml); @-moz-document url("https://www.chipmark.com/Manage"),url("https://chipmark.com/Manage"),url("https://www.chipmark.com/Main?target=pluginManage"),url("https://chipmark.com/Main?target=pluginManage"){ #manage_sort_menu{max-height:none!important} /*color/height fix*/ html,body{overflow:auto!important;background-color:#FFF!important;height:auto!important} /*hide extra stuff*/ #mainbox_ul,#mainbox_um,#mainbox_ur,#mainbox_ll,#mainbox_lm,#mainbox_lr, #mainbox_mm>*:not([style]), #mainbox_mm>table>tbody>tr>td[style], body>center>table>tbody>tr>td>table:not([style="table-layout: fixed;"]){display:none!important} /*postion/resize/others*/ #manage_status_bar{padding:3pt!important;width:auto!important;position:fixed!important;right:1%!important;bottom:5%!important;background-color:#FFCC33!important;color:#000!important;-moz-border-radius:4pt!important} #imageContainer{position:absolute!important;right:1%!important;bottom:8%!important} #manage_tree_div,#manage_list,#manage_list_div,#manage_panes{max-height:none!important;height:100%!important} #manage_tree{z-index:99!important} #manage_bar{z-index:9!important;width:40%!important;bottom:0!important;right:0!important;top:auto!important;left:auto!important;background-image:none!important;position:absolute!important} .manage_bar_title{position:absolute!important;bottom:15%!important;right:5%!important} #manage_bar_table img[width="15"][height="15"]{position:absolute!important;bottom:15%!important;right:1%!important} #manage_bar_table table tr, #manage_bar_table table td{display:-moz-box!important;-moz-box-orient:vertical!important} #manage_bar_table table{position:fixed!important;bottom:10%!important;right:1%!important;opacity:.3!important;background-color:#DDD!important;-moz-border-radius:4pt!important;border:1pt solid #AAA!important} #manage_bar_table table:hover{opacity:1!important;border-color:#999!important} #manage_panes{background-color:#FFF!important;position:absolute!important;left:0!important;top:0!important;width:100%!important} /*hide chipmark/label overflow*/ #manage_tree_div{overflow-x:hidden!important} /*loading box*/ #manage_loading{position:absolute!important;left:40%!important;bottom:5%!important;width:410px!important;height:424px!important;min-height:0!important;min-width:0!important} #manage_loading_status{color:#CC9933!important} #manage_progress_fill{background-color:#333399!important} /*manage bar buttons*/ #manage_bar td{padding:0!important} .manage_bar_actions{padding:4pt!important;display:block!important;-moz-border-radius:4pt!important} a.manage_bar_actions:hover{background-color:#FFCC33!important;color:#000!important} /*chipmark item buttons*/ .action_menu{padding:4pt 0!important;width:10em!important;text-align:center!important;display:block!important;-moz-border-radius:4pt!important} a.action_menu:hover{background-color:#FFCC33!important;color:#000!important} }
Sign In or Register to comment.