- userChrome.css・userContent.cssスレ Part7
853 ：名無しさん＠お腹いっぱい。[sage]：2017/12/10(日) 02:12:09.25 ID:TYAUhoFH0 - ステータスバー(ステータスパネル)をタイトルバー上に表示できたー
正確には本来のタイトルバーの上には別の要素は置けない(下に隠れる)っぽいので非表示にして
タブバーと重なってる偽のタイトルバーを上に引っ張り上げてそれを本物っぽい見た目にした
タイトルバーもステータスバーも自分は欲しい情報なので一行にまとまってうれしい
|
- userChrome.css・userContent.cssスレ Part7
855 ：名無しさん＠お腹いっぱい。[sage]：2017/12/10(日) 04:51:41.33 ID:TYAUhoFH0 - >>854
90行あるから自重したけど許可が出たと思って晒す
/* Fake titlebar with statuspanel */
/* 各種バーの並び順(タイトルバーが最上段と明示) */
#print-preview-toolbar,
#printedit-toolbar,
#titlebar {
-moz-box-ordinal-group: 0 !important;
}
#navigator-toolbox #toolbar-menubar {
-moz-box-ordinal-group: 1 !important;
}
#navigator-toolbox #TabsToolbar {
-moz-box-ordinal-group: 2 !important;
}
#navigator-toolbox #nav-bar {
-moz-box-ordinal-group: 3 !important;
}
#navigator-toolbox #PersonalToolbar {
-moz-box-ordinal-group: 4 !important;
}
#navigator-toolbox toolbar {
-moz-box-ordinal-group: 5;
}
/* タブバー左右端の隙間を詰める(閉じるボタンなどがあった場所に発生する) */
#main-window[tabsintitlebar] #TabsToolbar {
-moz-margin-end: 0 !important;
}
#main-window[tabsintitlebar] #TabsToolbar .titlebar-placeholder {
visibility: collapse !important;
}
|
- userChrome.css・userContent.cssスレ Part7
856 ：名無しさん＠お腹いっぱい。[sage]：2017/12/10(日) 04:52:16.12 ID:TYAUhoFH0 - >>855 の続き
/* 偽タイトルバーの配置 */
#main-window[tabsintitlebar] #titlebar {
margin-bottom: 0 !important;
height: 20px !important;
}
#main-window[tabsintitlebar] #titlebar-buttonbox {
height: 20px !important;
}
#main-window[tabsintitlebar] #titlebar-min,
#main-window[tabsintitlebar] #titlebar-max,
#main-window[tabsintitlebar] #titlebar-close {
padding: 0 16px !important;
}
/* 偽タイトルバー領域にページタイトルを表示 */
#main-window[tabsintitlebar]::before {
position: absolute;
margin: -22px 0 0 0;
padding: 0 130px 2px 2px;
width: 100%;
height: 20px;
font-size: 12px;
overflow: hidden;
content: url("chrome://branding/content/icon16.png") " " attr(title);
}
|
- userChrome.css・userContent.cssスレ Part7
857 ：名無しさん＠お腹いっぱい。[sage]：2017/12/10(日) 04:53:24.47 ID:TYAUhoFH0 - >>856 の続き
/* 偽タイトルバー領域にステータスパネルを表示 */
statuspanel {
position: fixed !important;
z-index: 1 !important;
top: 0 !important;
right: 0 !important;
margin: 0 !important;
padding: 0 !important;
max-width: 100% !important;
height: auto !important;
transition: none !important;
}
#main-window[tabsintitlebar]:not([inFullscreen]) statuspanel {
padding-left: 20px !important;
padding-right: 120px !important;
}
#main-window:not([tabsintitlebar]):not([inFullscreen]) statuspanel {
margin-top: 62px !important; /* 本物のタイトルバーの時にはコンテンツ領域の上端に */
}
statuspanel .statuspanel-inner {
height: auto !important;
}
statuspanel .statuspanel-label {
border: 1px solid #666666 !important;
padding: 1px !important;
font-size: 14px !important;
color: #fff !important;
background-color: rgba(51, 51, 51, 0.625) !important;
}
以上
|