Created
May 29, 2012 11:03
-
-
Save quietlynn/2827581 to your computer and use it in GitHub Desktop.
Maximized Stream Style with Right Column for Google+
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
To the extent possible under law, 林静琴 <https://github.com/quietlynn> has waived all copyright and related or neighboring rights to Maximized Stream Style with Right Column for Google+. This work is published from: United States. | |
http://creativecommons.org/publicdomain/zero/1.0/ | |
*/ | |
/* == 增大横向有效面积 == */ | |
/* 右侧边栏固定位置、固定宽度 */ | |
.hxa { | |
position: fixed !important; | |
margin-left: -286px !important; | |
width: 266px !important; | |
right: 0 !important; | |
margin-right: 30px !important; | |
top: 70px !important; | |
} | |
/* 高度较小的设备 */ | |
@media (max-height: 768px) { | |
/* 缩小分节间距 */ | |
.Tr { | |
margin-bottom: 20px !important; | |
} | |
/* 向右下对齐(反正小屏幕的话向上向下都一样) */ | |
.hxa { | |
top: auto !important; | |
bottom: 10px !important; | |
} | |
} | |
/* 高度很大的设备 */ | |
@media (min-height: 1200px) { | |
/* 个人资料页上重新固定右侧 */ | |
.vcard .hxa { | |
position: fixed !important; | |
} | |
} | |
/* 增加信息流、分享框宽度 */ | |
/* 左栏宽度最大 */ | |
.Nj, .ow, .wna { | |
width: auto !important; | |
} | |
.Nj { | |
margin-right: 286px !important; | |
} | |
/* 增加信息流宽度 */ | |
.l8, .Vra, .y0b, .dQ { | |
width: 100% !important; | |
} | |
/* 增加信息宽度 */ | |
.Tg, .Sb { | |
width: auto !important; | |
} | |
/* 增加信息评论区宽度 */ | |
.FE { | |
width: 99% !important; | |
width: -webkit-calc(100% - 6px) !important; | |
width: -moz-calc(100% - 6px) !important; | |
width: calc(100% - 6px) !important; | |
} | |
/* 增加分享框宽度 */ | |
.Cla { | |
width: 100% !important; | |
} | |
.Fm, .Ff { | |
width: 90% !important; | |
} | |
/* 贴子页面的用户资料向右下移动对齐,并固定 */ | |
/* 因为有人想要把头像和封面图片对齐,所以不在用户资料页移动头像。 */ | |
.CZb .Vka { | |
position: fixed !important; | |
width: 262px !important; | |
top: 140px !important; | |
right: 0 !important; | |
margin-right: 30px !important; | |
left: auto !important; | |
margin-left: 100px !important; | |
} | |
/* 个人资料右侧操作显示为面板 */ | |
.IT { | |
-webkit-border-radius: 0 0 3px 3px; | |
-moz-border-radius: 0 0 3px 3px; | |
border-radius: 0 0 3px 3px; | |
-webkit-box-shadow: 0 1px 0 rgba(101, 101, 101, .1); | |
-moz-box-shadow: 0 1px 0 rgba(101,101,101,.1); | |
box-shadow: 0 1px 0 rgba(101, 101, 101, .1); | |
background-color: #F9F9F9; | |
border-right: 1px solid #CCC; | |
border-left: 1px solid #CCC; | |
border-bottom: 1px solid #CCC; | |
margin: 0 3px 0 3px; | |
position: relative; | |
z-index: 11; | |
padding: 10px 10px 5px 15px; | |
margin-right: 6px; | |
} | |
/* 分隔线 */ | |
.aua { | |
top: auto !important; | |
bottom: 30px !important; | |
position: absolute !important; | |
margin-bottom: 0px !important; | |
margin-left: -15px !important; | |
} | |
/* 减小『设置·帮助·反馈』上方边距 */ | |
.LCa { | |
margin-top: 6px !important; | |
} | |
/* 关于页面的链接改在下方 */ | |
.qla.ML { | |
clear: both | |
} | |
/* 个人页面隐藏个人资料详情 */ | |
.vcard .IT, .vcard .Oka { | |
top: -262px !important; | |
/* CSS3 Please! */ | |
transition-property: top; | |
transition-duration: 1s; | |
-webkit-transition-property: top; | |
-webkit-transition-duration: 1s; | |
-moz-transition-property: top; | |
-moz-transition-duration: 1s; | |
-ms-transition-property: top; | |
-ms-transition-duration: 1s; | |
-o-transition-property: top; | |
-o-transition-duration: 1s; | |
} | |
/* 悬停在头像时显示下拉面板 */ | |
.vcard .Vka:hover div:not(.hxa) { | |
top: initial !important; | |
} | |
/* 隐藏左侧导航栏 */ | |
.Qdb { | |
left: -90px; | |
/* CSS3 Please! */ | |
transition-property: left; | |
transition-duration: 1s; | |
-webkit-transition-property: left; | |
-webkit-transition-duration: 1s; | |
-moz-transition-property: left; | |
-moz-transition-duration: 1s; | |
-ms-transition-property: left; | |
-ms-transition-duration: 1s; | |
-o-transition-property: left; | |
-o-transition-duration: 1s; | |
} | |
/* 调整内容区域边距 */ | |
.wna { | |
margin: 0 0 0 10px !important; | |
} | |
.vna { | |
margin: 0 0 0 10px !important; | |
} | |
/* 顶端信息流栏位置修复 */ | |
.XI { | |
left: 10px !important; | |
right: 0 !important; | |
} | |
.Uua { | |
left: 10px !important; | |
right: 0 !important; | |
} | |
/* 悬停时显示左侧导航栏 */ | |
.Qdb:hover { | |
left: 0px; | |
} | |
.Qdb:hover ~ .Qdb { | |
left: 0px; | |
} | |
/* 隐藏右侧 GTalk 栏 */ | |
.Hoa.RWa { | |
right: -220px !important; | |
z-index: 9999 !important; | |
/* CSS3 Please! */ | |
transition-property: right; | |
transition-duration: 1s; | |
-webkit-transition-property: right; | |
-webkit-transition-duration: 1s; | |
-moz-transition-property: right; | |
-moz-transition-duration: 1s; | |
-ms-transition-property: right; | |
-ms-transition-duration: 1s; | |
-o-transition-property: right; | |
-o-transition-duration: 1s; | |
border: 10px solid rgba(0,0,0,0) !important; | |
box-sizing: initial !important; | |
} | |
/* 悬停时显示右侧 GTalk 栏 */ | |
.Hoa.RWa:hover { | |
right: 0px !important; | |
} | |
#gth-hover-card_m { | |
color: red !important; | |
position: fixed !important; | |
z-index: 99999 !important; | |
} | |
/* 去除黑背景,靠左对齐 */ | |
.aG { | |
margin: 0 0 0 2px !important; | |
} | |
.Fg { | |
background-color: transparent !important; | |
margin-bottom: 10px !important; | |
} | |
/* 隐藏图片边框 */ | |
.jtzWJd, .Rr7baf { | |
display: none !important; | |
} | |
/* “更多图片”链接位于左侧 */ | |
.dg { | |
right: auto !important; | |
} | |
/* 活动主题照片不拉伸 */ | |
.zR .HB, .zR .CI5GWc, .zR .bOyKXc { | |
width: auto !important; | |
} | |
/* == 减少纵向空白空间 == */ | |
/* 减少信息之间纵向间隔 */ | |
.Tg { | |
margin-top: 5px !important; | |
margin-bottom: 5px !important; | |
} | |
/* 缩小评论栏空白边距 */ | |
.Ae { | |
padding: 0 14px 10px 56px !important; | |
} | |
/* 新评论栏边距 */ | |
.dw { | |
margin: 1px 12px 1px 0 !important; | |
padding: 2px 7px !important; | |
} | |
/* 减少作者栏上边距 */ | |
.MI { | |
padding: 3px 3px 0 16px !important; | |
} | |
.ck, .Wp { | |
padding: 5px 0 0 0 !important; | |
} | |
/* 减少按钮栏上下边距 */ | |
.LI { | |
height: 28px !important; | |
} | |
.dk, .Hf { | |
margin-top: 2px !important; | |
} | |
/* 活动按钮边距 */ | |
.ml { | |
padding-top: 2px !important; | |
} | |
.XJ { | |
padding-top: 1px !important; | |
} | |
.eK, .dI { | |
line-height: 30px !important; | |
} | |
/* 信息流栏不总是置顶 */ | |
.XI { | |
left: initial !important; | |
position: relative !important; | |
right: 0 !important; | |
} | |
/* == 可选:强制使用窄顶端导航条样式(即使屏幕高度较大) == */ | |
#gb { | |
max-height: 69px !important; | |
} | |
#gb #gbx1, #gb #gbx2, #gb #gbq, #gb #gbu { | |
top: 24px !important; | |
} | |
#gbx3 { | |
height: 23px !important; | |
} | |
#gb #gbbw, #gb #gbbw { | |
top: 74px !important; | |
} | |
#gbzw { | |
height: 24px !important; | |
margin-left: 23px !important; | |
} | |
#gbq1, #gb #gbq1, #gbq1, #gb #gbq1 { | |
margin-left: 33px !important; | |
} | |
#gbq2, #gb #gbq2 { | |
padding-bottom: 0 !important; | |
} | |
#gbu, #gbq2, #gbq3 { | |
padding-top: 8px !important; | |
} | |
#gbq2, #gb #gbq2 { | |
margin-left: 188px !important; | |
} | |
#gb #gbu .gbt { | |
margin-left: 6px !important; | |
} | |
#gbx1, #gbx2, #gbqlw, #gb #gbx1, #gb #gbx2, #gb #gbqlw { | |
height: 44px !important; | |
} | |
.wl { | |
visibility: hidden !important; | |
} | |
.gbg4p { | |
margin-top: 0px !important; | |
} | |
#gbg4 #gbgs4, #gbi4i, #gbi4id, #gbi4ip { | |
max-height: 27px !important; | |
max-width: 27px !important; | |
} | |
#gbgs4 .gbmai, #gbgs4 .gbmai { | |
left: 33px !important; | |
top: 12px !important; | |
} | |
#gb #gbg4 #gbgs4 .gbmab { | |
left: 5px !important; | |
margin: 30px 0 0 !important; | |
} | |
#gb #gbg4 #gbgs4 .gbmac { | |
left: 5px !important; | |
margin: 31px 0 0 !important; | |
} | |
#gb .gbto #gbd1, #gb .gbto #gbd3, #gb .gbto #gbd4, #gb .gbto #gbs { | |
top: 40px !important; | |
} | |
#gbg3 .gbmab, #gbgs4 .gbmab, #gbg1 .gbmab { | |
margin: 30px 0 0 !important; | |
} | |
#gb #gbg3 .gbmac, #gb #gbgs4 .gbmac, #gb #gbg1 .gbmac { | |
margin: 31px 0 0 !important; | |
} | |
.Dob { | |
max-height: 70px !important; | |
} | |
/* == 可选:低分辨率屏幕固定上方导航条 == */ | |
@media (max-height: 768px) { | |
.Ofc { | |
position: fixed; | |
width: 100%; | |
} | |
.G8a { | |
padding-top: 70px !important; | |
} | |
.hxa { | |
position: fixed !important; | |
top: 70px !important; | |
} | |
/* 顶端边框位置修复 */ | |
.Uua { | |
top: 70px !important; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment