Last active
November 18, 2018 15:41
-
-
Save joao/b72d2002f8a1b17d0345b670a359904c to your computer and use it in GitHub Desktop.
old Gmail stylesheet
This file contains hidden or 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
| /* Hide Gmail logo */ | |
| #gb > div.gb_Ld.gb_je.gb_Td > div.gb_Dc.gb_5d.gb_Je { | |
| visibility: hidden; | |
| } | |
| /* Hide side panel */ | |
| body > div:nth-child(17) > div.nH > div > div.nH.bkL > div.no > div.nH.bAw.nn.it > div.brC-dA-I-Jw { | |
| visibility: hidden; | |
| } | |
| /* From: | |
| https://github.com/shellscape/gmail-classic | |
| */ | |
| /* | |
| Copyright © 2018 Andrew Powell | |
| This Source Code Form is subject to the terms of the Mozilla Public | |
| License, v. 2.0. If a copy of the MPL was not distributed with this | |
| file, You can obtain one at http://mozilla.org/MPL/2.0/. | |
| The above copyright notice and this permission notice shall be | |
| included in all copies or substantial portions of this Source Code Form. | |
| */ | |
| /* ## Generics */ | |
| /* Use @font-face to prevent conflicts with received HTML email */ | |
| @font-face { | |
| font-family: "Roboto"; | |
| font-weight: 100 549; | |
| src: local("Arial"); | |
| } | |
| @font-face { | |
| font-family: "Roboto"; | |
| font-weight: 550 900; | |
| src: local("Arial Bold"); | |
| } | |
| @font-face { | |
| font-family: "Google Sans"; | |
| font-weight: normal; | |
| font-weight: 100 549; | |
| src: local("Arial"); | |
| } | |
| @font-face { | |
| font-family: "Google Sans"; | |
| font-weight: normal; | |
| font-weight: 550 900; | |
| src: local("Arial Bold"); | |
| } | |
| * { | |
| -webkit-font-smoothing: auto !important; | |
| letter-spacing: 0 !important; | |
| } | |
| body, | |
| td, | |
| input, | |
| textarea, | |
| select { | |
| box-shadow: none !important; | |
| font-size: 12.8px !important; | |
| margin: 0 !important; | |
| } | |
| span { | |
| font-size: 12.8px; | |
| letter-spacing: normal; | |
| } | |
| a { | |
| font-size: 12.8px; | |
| } | |
| .aeN, | |
| .wT { | |
| min-width: 202px !important; | |
| } | |
| .nM, | |
| .xY, | |
| .yW { | |
| font-size: 0.8rem !important; | |
| } | |
| .TK .TO { | |
| -webkit-border-radius: 0 !important; | |
| border-radius: 0 !important; | |
| } | |
| .TN .qr { | |
| display: none; | |
| } | |
| /* ## Buttons */ | |
| .qr { | |
| visibility: hidden !important; | |
| } | |
| .Bn { | |
| border: none !important; | |
| } | |
| .bzo > .G-tF > .G-Ni > .T-I, | |
| .SI .bzo > .G-tF > .G-Ni > .T-I { | |
| margin-left: 0; | |
| } | |
| .bzn:not(.bzo) .mA > .Bn { | |
| margin: 0 !important; | |
| } | |
| div[role="button"] div::before { | |
| /* Remove Button Animation */ | |
| transform: scale(0) !important; | |
| } | |
| body[jsaction] [gh="cm"] { | |
| /* Compose */ | |
| background-color: #d14836 !important; | |
| background-image: linear-gradient(to bottom, #dd4b39, #d14836) !important; | |
| border: 1px solid transparent !important; | |
| border-radius: 2px !important; | |
| box-shadow: none !important; | |
| color: #fff !important; | |
| font-size: 11px !important; | |
| font-weight: bold !important; | |
| height: 27px !important; | |
| line-height: 27px !important; | |
| margin-left: 18px !important; | |
| text-shadow: 0 1px rgba(0, 0, 0, 0.1) !important; | |
| text-transform: uppercase !important; | |
| } | |
| body[jsaction] [gh="cm"]::before { | |
| /* Compose Background */ | |
| background-image: none !important; | |
| min-width: 26px !important; | |
| } | |
| body[jsaction] div[jscontroller] > div > div > div > div { | |
| /* Compose Background */ | |
| margin: -1px !important; | |
| padding-top: 15px !important; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] > div div[style]::after { | |
| /* Folders */ | |
| display: none !important; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] > div div[style]::before { | |
| /* Folders */ | |
| border-radius: 0 !important; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] div div:nth-child(4) { | |
| /* Tag Dropdown */ | |
| margin-right: 15px; | |
| position: absolute; | |
| top: 0; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] div div:nth-child(4) div[aria-haspopup="true"]::before { | |
| /* No Bubbles */ | |
| background-color: initial !important; | |
| } | |
| body[jsaction] [role="navigation"] [data-collapsed-nav-tooltip] { | |
| /* No Bubbles */ | |
| border-radius: 0 !important; | |
| } | |
| body[jsaction] [role="navigation"] a { | |
| /* No Bubbles */ | |
| font-size: 12.8px !important; | |
| } | |
| .TI .T-I-ax7, | |
| .z0 .T-I-ax7, | |
| .G-atb .T-I-ax7, | |
| .Bn { | |
| background-color: transparent !important; | |
| background-image: -webkit-linear-gradient(top, #f5f5f5, #f1f1f1) !important; | |
| background-image: linear-gradient(top, #f5f5f5, #f1f1f1) !important; | |
| background-image: -webkit-linear-gradient(to bottom, #f5f5f5, #f1f1f1) !important; | |
| background-image: linear-gradient(to bottom, #f5f5f5, #f1f1f1) !important; | |
| font-size: 11px !important; | |
| font-weight: bold !important; | |
| } | |
| /* stylelint-disable-next-line */ | |
| .TI .T-I-ax7, | |
| .z0 .T-I-ax7, | |
| .G-atb .T-I-ax7, | |
| .Bn { | |
| border: 1px solid rgba(0, 0, 0, 0.1) !important; | |
| border-radius: 2px !important; | |
| height: 26px !important; | |
| line-height: 27px !important; | |
| min-width: 64px !important; | |
| } | |
| .G-tF > .G-Ni > .T-I, | |
| .SI .G-tF > .G-Ni > .T-I { | |
| margin-left: 0 !important; | |
| margin-right: 24px !important; | |
| } | |
| .G-atb { | |
| padding: 0 16px 0 0 !important; | |
| } | |
| .G-Ni.J-J5-Ji > .T-I { | |
| margin-right: 0 !important; | |
| } | |
| .aqL .G-Ni.J-J5-Ji { | |
| -webkit-box-shadow: none !important; | |
| box-shadow: none !important; | |
| margin-right: 32px !important; | |
| padding-right: 0 !important; | |
| } | |
| .G-Ni.G-aE { | |
| margin-right: 32px !important; | |
| } | |
| .G-Ni.J-J5-Ji > .T-I:not(:first-child) { | |
| border-bottom-left-radius: 0 !important; | |
| border-top-left-radius: 0 !important; | |
| } | |
| .G-Ni.J-J5-Ji:not(:first-child) > .T-I:not(:last-child) { | |
| border-bottom-right-radius: 0 !important; | |
| border-top-right-radius: 0 !important; | |
| margin-right: -1px !important; | |
| } | |
| .aqK, | |
| .G-tF, | |
| .aqJ, | |
| .iH, | |
| .adF { | |
| height: 28px !important; | |
| } | |
| .d-Na-JX-I.d-Na-M7-JX.d-Na-Gs, | |
| .d-Na-JX-I.d-Na-JG.d-Na-IF { | |
| height: 28px !important; | |
| line-height: 28px !important; | |
| } | |
| .G-atb .aqJ .amD, | |
| .G-atb .aqJ .T-I-ax7 { | |
| margin-left: 0 !important; | |
| min-width: 40px !important; | |
| } | |
| .G-atb .aqJ .amD:nth-child(2) { | |
| margin-left: 20px !important; | |
| } | |
| .T-I-JW.amD::before, | |
| .G-Ni .G-asx::before { | |
| display: none !important; | |
| } | |
| .asa::before, | |
| .T-Jo::before, | |
| .d-Na-JX-I::before { | |
| display: none !important; | |
| } | |
| .G-Ni.G-aE:not(:first-child) { | |
| -webkit-box-shadow: none !important; | |
| box-shadow: none !important; | |
| } | |
| .iG .h0 .adg { | |
| margin-left: 0 !important; | |
| min-width: 40px !important; | |
| } | |
| .h0 > .adl { | |
| padding-right: 20px !important; | |
| } | |
| .nH .gm-boomerang-button-home { | |
| background-image: linear-gradient(to bottom, #f5f5f5, #f1f1f1) !important; | |
| border-radius: 2px !important; | |
| color: transparent !important; | |
| line-height: 26px !important; | |
| padding-top: 0 !important; | |
| position: relative !important; | |
| text-indent: -9999px !important; | |
| top: 0 !important; | |
| width: 66px !important; | |
| } | |
| .nH .gm-boomerang-button-home:hover { | |
| background-image: linear-gradient(to bottom, #dbdbdb, #e8e8e8) !important; | |
| } | |
| .nH .gm-boomerang-button-home img { | |
| left: 20px !important; | |
| position: absolute !important; | |
| top: 6px !important; | |
| } | |
| .bzn .G-Ni { | |
| margin-left: 0 !important; | |
| } | |
| .inboxsdk__thread_toolbar_parent .bzn .G-Ni { | |
| margin-right: 32px !important; | |
| padding-right: 0 !important; | |
| } | |
| .gm-boomerang-button-thread { | |
| background-image: linear-gradient(to bottom, #f5f5f5, #f1f1f1) !important; | |
| position: relative !important; | |
| text-indent: -20px !important; | |
| top: 1px !important; | |
| width: 140px !important; | |
| } | |
| .gm-boomerang-button-thread:hover { | |
| background-image: linear-gradient(to bottom, #dbdbdb, #e8e8e8) !important; | |
| } | |
| .gm-boomerang-button-thread img { | |
| left: 20px !important; | |
| position: absolute !important; | |
| top: 6px !important; | |
| } | |
| .adg::before { | |
| display: none !important; | |
| } | |
| /* ## Email Count */ | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] div div.aio { | |
| flex: inherit !important; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] div div.aio div:last-child { | |
| color: #222; | |
| display: initial !important; | |
| font-size: 12.8px; | |
| font-weight: bold; | |
| padding-left: 5px; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] div div.aio div:last-child::before { | |
| content: "("; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] div div.aio div:last-child:last-child::after { | |
| content: ")"; | |
| } | |
| /* ## Labels */ | |
| .ar { | |
| border-radius: 5 !important; | |
| font-size: 0.7rem !important; | |
| } | |
| /* ## List Rows */ | |
| .wT > .n3 .byl:first-child .aim:first-child .nZ { | |
| background-color: transparent !important; | |
| } | |
| .yO { | |
| background: rgba(242, 245, 245, 0.8) !important; | |
| border-bottom: 1px #e5e5e5 solid !important; | |
| color: #222 !important; | |
| } | |
| .zA { | |
| /* Rows */ | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important; | |
| box-shadow: unset !important; | |
| padding-bottom: 7px; | |
| padding-top: 6px; | |
| } | |
| .zE { | |
| border-bottom: 1px #e5e5e5 solid !important; | |
| color: #222 !important; | |
| -webkit-font-smoothing: auto !important; | |
| } | |
| .x7 { | |
| /* Selected Row */ | |
| background: #ffc !important; | |
| color: #222 !important; | |
| } | |
| .zA:hover, | |
| .zE, | |
| .yO { | |
| -webkit-box-shadow: none !important; | |
| box-shadow: none !important; | |
| -webkit-font-smoothing: auto !important; | |
| } | |
| .yW { | |
| -webkit-font-smoothing: auto !important; | |
| } | |
| /* ## Subject Preview */ | |
| .zA .ze { | |
| font-weight: 400; | |
| } | |
| /* ## Email Detail View */ | |
| .hx .gD { | |
| /* Sender Name */ | |
| font-size: 15px; | |
| font-weight: 500; | |
| } | |
| .ha > .hP { | |
| /* Subject */ | |
| font-size: 18px; | |
| } | |
| div { | |
| /* Tab / Sender */ | |
| font-weight: 400; | |
| } | |
| .bA4 { | |
| font-size: 13px !important; | |
| } | |
| /* ## Left Nav */ | |
| .TO .n0 { | |
| color: #222 !important; | |
| font-size: 13px !important; | |
| } | |
| .TO { | |
| border-left: 4px solid transparent; | |
| } | |
| .nZ.aiq { | |
| background: transparent !important; | |
| border-left: 4px solid rgb(221, 75, 57) !important; | |
| } | |
| .nZ.TO .n0 { | |
| color: rgb(221, 75, 57) !important; | |
| text-shadow: none !important; | |
| } | |
| .gb_Ra { | |
| /* Logo Border */ | |
| background-color: #f1f1f1 !important; | |
| border-width: 0 !important; | |
| } | |
| div[role="navigation"][style][aria-labelledby] h2 + div { | |
| max-width: 179px !important; | |
| min-width: 179px !important; | |
| } | |
| body[jsaction] .ain [data-collapsed-nav-tooltip][data-tooltip] > div { | |
| /* Selection */ | |
| background: #fff; | |
| } | |
| body[jsaction] .ain [data-collapsed-nav-tooltip][data-tooltip] > div::before { | |
| border-left: 4px solid #dd4b39; | |
| content: ""; | |
| display: block; | |
| height: 100%; | |
| left: 0; | |
| position: absolute; | |
| width: 100%; | |
| } | |
| body[jsaction] .ain [data-collapsed-nav-tooltip][data-tooltip] > div:hover { | |
| background: transparent !important; | |
| background-color: #f1f3f4 !important; | |
| } | |
| body[jsaction] .ain [data-collapsed-nav-tooltip][data-tooltip] > div a { | |
| color: #dd4b39 !important; | |
| } | |
| body[jsaction] .ain [data-collapsed-nav-tooltip][data-tooltip] > div > div:nth-child(3) div { | |
| /* Email Count */ | |
| color: #dd4b39 !important; | |
| } | |
| body[jsaction] [role="navigation"] [data-collapsed-nav-tooltip] > div > div:first-child, | |
| body[jsaction] [role="navigation"] [data-collapsed-nav-tooltip] > div img + div { | |
| /* Email Count Icon */ | |
| display: none !important; | |
| } | |
| body[jsaction] [role="navigation"] [data-collapsed-nav-tooltip] > div { | |
| height: 21px !important; | |
| } | |
| /* ## Tabs */ | |
| .aAy.aIf-aLe.J-KU-KO, | |
| .aAy.aKe-aLe.J-KU-KO, | |
| .aAy.aJi-aLe.J-KU-KO, | |
| .aAy.aH2-aLe.J-KU-KO { | |
| height: 38px !important; | |
| } | |
| .aKh { | |
| background-color: #f5f5f5 !important; | |
| height: 38px !important; | |
| margin-top: 5px !important; | |
| } | |
| .l2 { | |
| padding-bottom: 5px !important; | |
| } | |
| .l6 { | |
| padding-top: 0 !important; | |
| } | |
| .bAp.b8.UC .vh { | |
| font-size: 12px; | |
| margin-left: 260px; | |
| opacity: 0.4; | |
| padding-right: 30px; | |
| } | |
| /* ## Header */ | |
| header[role="banner"] { | |
| background-color: #f1f1f1 !important; | |
| } | |
| #aso_search_form_anchor { | |
| background-color: #fff !important; | |
| } | |
| #aso_search_form_anchor:hover { | |
| box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) !important; | |
| } | |
| /* ## Message */ | |
| [role="main"] table[role="presentation"] > tr > td:first-child > div:nth-child(2) > div:first-child { | |
| /* Title */ | |
| padding: 8px 0 0 8px; | |
| position: relative; | |
| } | |
| div:not([role="list"]) div[data-message-id][class]::before { | |
| /* Title Bottom Border */ | |
| border-bottom: 1px solid #d8d8d8; | |
| content: ""; | |
| height: 1px; | |
| pointer-events: none; | |
| position: absolute; | |
| top: 7px; | |
| width: 100%; | |
| } | |
| [role="main"] table[role="presentation"] > tr > td:first-child > div:nth-child(2) h2 { | |
| font-size: 17.6px; | |
| } | |
| /* ## Tags */ | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] > div div[style], | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] > div div.qj { | |
| margin-right: 0 !important; | |
| position: absolute; | |
| right: 0; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] > div div.qj::after { | |
| display: none; | |
| } | |
| body[jsaction] [data-collapsed-nav-tooltip][data-tooltip-suspended] > div div.qj::before { | |
| border-radius: 0 !important; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment