본 사이트는 여러분의 사용자 경험을 개선하기 위해 유지 보수를 진행하는 동안 기능이 제한됩니다. 도움말로 문제가 해결되지 않고 질문을 하고 싶다면 Twitter의 @FirefoxSupport 및 Reddit의 /r/firefox 채널을 활용하세요.

Mozilla 도움말 검색

고객 지원 사기를 피하세요. 저희는 여러분께 절대로 전화를 걸거나 문자를 보내거나 개인 정보를 공유하도록 요청하지 않습니다. "악용 사례 신고"옵션을 사용하여 의심스러운 활동을 신고해 주세요.

자세히 살펴보기

Remove boxshadow from tabs bar firefox 65

  • 8 답장
  • 1 이 문제를 만남
  • 1 보기
  • 최종 답변자: Icehole486

more options

After upgrading to Firefox 65 I had to change my chrome.css file to the following to get the Open Tabs bar back below the Favorites Bar. What can I add to remove the light shadow from all the unopen tabs in the Tabs Bar?

Current chrome.css: @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

/* TABS: on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
#TabsToolbar {-moz-box-ordinal-group:1000!important}

#TabsToolbar {
 position: absolute !important;
 bottom: 0 !important;
 width: 100vw !important;
}

#tabbrowser-tabs {
  width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}

/* TABS: height */
:root {
 --tab-toolbar-navbar-overlap: 0px !important;
 --tab-min-height: 33px !important; /* adjust to suit your needs */
}
:root #tabbrowser-tabs {
 --tab-min-height: 33px !important; /* needs to be the same as above under :root */
 --tab-min-width: 80px !important;
}

#TabsToolbar {
 height: var(--tab-min-height) !important;
 margin-bottom: 1px !important;
 box-shadow: none, -moz-dialog 0 1px !important;
 background-color: var(--toolbar-bgcolor) !important;
}

#tabbrowser-tabs,
#tabbrowser-tabs > .tabbrowser-arrowscrollbox,
.tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] {
  min-height: var(--tab-min-height) !important;
  max-height: var(--tab-min-height) !important;
}

/* drag space */
.titlebar-spacer[type=pre-tabs], .titlebar-spacer[type=post-tabs] {
  width: 40px;
}

/* Override vertical shifts when moving a tab */
#navigator-toolbox[movingtab] > #titlebar > #TabsToolbar {
  padding-bottom: unset !important;
}
#navigator-toolbox[movingtab] #tabbrowser-tabs {
  padding-bottom: unset !important;
  margin-bottom: unset !important;
}
#navigator-toolbox[movingtab] > #nav-bar {
  margin-top: unset !important;
}

/* tabs on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
#TabsToolbar {-moz-box-ordinal-group:1000!important}
/* Transparent toolbar backgrounds */
#nav-bar, #PersonalToolbar {
  background-color: transparent !important;
  background-image: none !important;
}
/* Remove top line on nav bar */
#nav-bar {
  box-shadow: none !important;
}
After upgrading to Firefox 65 I had to change my chrome.css file to the following to get the Open Tabs bar back below the Favorites Bar. What can I add to remove the light shadow from all the unopen tabs in the Tabs Bar? Current chrome.css: @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */ <pre><nowiki>/* TABS: on bottom */ #navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10} #TabsToolbar {-moz-box-ordinal-group:1000!important} #TabsToolbar { position: absolute !important; bottom: 0 !important; width: 100vw !important; } #tabbrowser-tabs { width: 100vw !important; } #main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;} /* TABS: height */ :root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 33px !important; /* adjust to suit your needs */ } :root #tabbrowser-tabs { --tab-min-height: 33px !important; /* needs to be the same as above under :root */ --tab-min-width: 80px !important; } #TabsToolbar { height: var(--tab-min-height) !important; margin-bottom: 1px !important; box-shadow: none, -moz-dialog 0 1px !important; background-color: var(--toolbar-bgcolor) !important; } #tabbrowser-tabs, #tabbrowser-tabs > .tabbrowser-arrowscrollbox, .tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] { min-height: var(--tab-min-height) !important; max-height: var(--tab-min-height) !important; } /* drag space */ .titlebar-spacer[type=pre-tabs], .titlebar-spacer[type=post-tabs] { width: 40px; } /* Override vertical shifts when moving a tab */ #navigator-toolbox[movingtab] > #titlebar > #TabsToolbar { padding-bottom: unset !important; } #navigator-toolbox[movingtab] #tabbrowser-tabs { padding-bottom: unset !important; margin-bottom: unset !important; } #navigator-toolbox[movingtab] > #nav-bar { margin-top: unset !important; } /* tabs on bottom */ #navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10} #TabsToolbar {-moz-box-ordinal-group:1000!important} /* Transparent toolbar backgrounds */ #nav-bar, #PersonalToolbar { background-color: transparent !important; background-image: none !important; } /* Remove top line on nav bar */ #nav-bar { box-shadow: none !important; }</nowiki></pre>
첨부된 스크린샷

글쓴이 cor-el 수정일시

모든 댓글 (8)

more options

Look thru the recent questions over here: https://www.reddit.com/r/FirefoxCSS/

Or ask about that issue there.

more options

Couldn't find anything there that was relevant. Went back to 64 for now.

more options

That is possibly a side effect from using a lightweight theme to style the user interface area.

Does this still happen with one of the builtin themes?

more options

When I first upgraded to FF 57 someone on here told me that the the "fog" or "shadows" on those bars was a holdover from using Classic Theme Restorer on 56 and gave me the following code to get rid of it and move the open tabs bar. This code doesn't work with 65.

/* Transparent toolbar backgrounds */
#nav-bar, #PersonalToolbar {
background-color: transparent !important;
background-image: none !important;
}
/* Remove top line on nav bar */
#nav-bar {
box-shadow: none !important;
}

글쓴이 cor-el 수정일시

more options

cor-el said

That is possibly a side effect from using a lightweight theme to style the user interface area. Does this still happen with one of the builtin themes?

Went back to 65 and the entire tabs bar is highlighted with all themes. In 64 only the open tab is highlighted.

more options

I deleted the ClassicThemeRestorter.XPI file and edited the userChrome.css file and got rid of the fog/light shadow on the open tabs bar but it is still there on the Navbar. I don't see any reference to the background color of the Navbar in the userChrome.css file. I can live with it the way it is but would like the background of the Navbar to be transparent. Anyone have an idea as to how I can accomplish that?

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

/* TABS: on bottom */

  1. navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
  2. TabsToolbar {-moz-box-ordinal-group:1000!important}
  1. TabsToolbar {
position: absolute !important;
bottom: 0 !important;
width: 100vw !important;

}

  1. tabbrowser-tabs {
 width: 100vw !important;

}

  1. main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}

/* TABS: height */

root {
--tab-toolbar-navbar-overlap: 0px !important;
--tab-min-height: 33px !important; /* adjust to suit your needs */

}

root #tabbrowser-tabs {
--tab-min-height: 33px !important; /* needs to be the same as above under :root */
--tab-min-width: 80px !important;

}


  1. tabbrowser-tabs,
  2. tabbrowser-tabs > .tabbrowser-arrowscrollbox,

.tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] {

 min-height: var(--tab-min-height) !important;
 max-height: var(--tab-min-height) !important;

}

/* drag space */ .titlebar-spacer[type=pre-tabs], .titlebar-spacer[type=post-tabs] {

 width: 40px;

}

/* Override vertical shifts when moving a tab */

  1. navigator-toolbox[movingtab] > #titlebar > #TabsToolbar {
 padding-bottom: unset !important;

}

  1. navigator-toolbox[movingtab] #tabbrowser-tabs {
 padding-bottom: unset !important;
 margin-bottom: unset !important;

}

  1. navigator-toolbox[movingtab] > #nav-bar {
 margin-top: unset !important;

}

/* hide windows-controls */

  1. TabsToolbar #window-controls {display:none!important;}

/* move caption buttons to right of Tab bar */

  1. main-window[tabsintitlebar]:not([inFullscreen="true"]) #toolbar-menubar[autohide="true"] ~ #TabsToolbar .titlebar-buttonbox-container {
position: fixed !important;
right: 0 !important;
top: calc(6px + var(--tab-min-height)) !important;
display: block !important;
visibility: visible !important;

}

  1. toolbar-menubar[autohide="true"] ~ #TabsToolbar /* Transparent toolbar backgrounds */
  2. nav-bar, #PersonalToolbar {
 background-color: transparent !important;
 background-image: none !important;

}

more options

If you use a lightweight theme then Firefox automatically adds shadow to text to ensure you always see some text regardless of the color of this theme. You will have to accept this text shadow.

more options

No matter what theme I use I get the whole Navigation bar highlighted. Below is what I get without a userChrome.css file. After I add the file to move the Open tabs bar down that whole bar is highlighted.