Skip to content

Instantly share code, notes, and snippets.

@quietlynn
Created May 29, 2012 11:03
Show Gist options
  • Save quietlynn/2827581 to your computer and use it in GitHub Desktop.
Save quietlynn/2827581 to your computer and use it in GitHub Desktop.
Maximized Stream Style with Right Column for Google+
/*
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