Google Voice Userstyle


/ Published in: CSS
Save to your folder(s)

Use this userstyle with Fluid for a sweet desktop Google Voice application.


Copy this code and paste it in your HTML
  1. * {
  2. outline: none !important;
  3. }
  4.  
  5. a {
  6. display: inline-block;
  7. padding: 2px 4px;
  8. background: #eee;
  9. -webkit-border-radius: 3px;
  10. text-decoration: none;
  11. color: #435385 !important;
  12. }
  13.  
  14. a:hover {
  15. background: #dee3f1 !important;
  16. color: #435385 !important;
  17. text-decoration: none !important;
  18. }
  19.  
  20. .gc-message-bg-m div, .gc-message-bg-g div {
  21. text-decoration: none !important;
  22. color: #344d93 !important;
  23. }
  24.  
  25. #gbar {
  26. display: none !important;
  27. }
  28.  
  29. #gc-gaia-bar .gbh {
  30. display: none !important;
  31. }
  32.  
  33. #gc-gaia-bar .gc-header-right {
  34. position: absolute !important;
  35. right: 0px !important;
  36. color: rgba(255,255,255,0.2) !important;
  37. text-shadow: #000000 1px 0 0 !important;
  38. padding-top: 10px !important;
  39. }
  40.  
  41. #gc-header {
  42. background: -webkit-gradient(
  43. linear,
  44. left bottom,
  45. left top,
  46. color-stop(0, rgb(166,166,166)),
  47. color-stop(1, rgb(97,97,97))
  48. ) !important;
  49. border-top: 1px solid #4b4b4b !important;
  50. margin-left: 170px !important;
  51. }
  52.  
  53. .gc-header-logo {
  54. display: none !important;
  55. }
  56.  
  57. .gc-search {
  58. margin: 6px 8px !important;
  59. padding: 0 !important;
  60. width: 223px !important;
  61. -webkit-box-shadow: rgba(0,0,0,0.6) 0 1px 3px;
  62. -webkit-border-radius: 5px;
  63. z-index: 7 !important;
  64. position: relative !important;
  65. }
  66.  
  67. .gc-header-left {
  68. padding: 0 !important;
  69. }
  70.  
  71. #gc-search-input {
  72. margin: 0 !important;
  73. background: -webkit-gradient(
  74. linear,
  75. left bottom,
  76. left top,
  77. color-stop(1, rgb(177,177,177)),
  78. color-stop(0.3, rgb(235,235,235)),
  79. color-stop(0, rgb(285,285,285))
  80. ) !important;
  81. border: 0px !important;
  82. height: 19px !important;
  83. -webkit-border-radius: 5px;
  84. z-index: 6 !important;
  85. position: relative !important;
  86. outline: none !important;
  87. width: 220px !important;
  88. }
  89.  
  90. #gc-search-btn {
  91. display: none !important;
  92. }
  93.  
  94. #gc-search-btn div.goog-inline-block.goog-button-base-outer-box {
  95. border: 1px solid #9d9d9d !important;
  96. border-top: 0px !important;
  97. -webkit-border-top-right-radius: 5px;
  98. -webkit-border-bottom-right-radius: 5px;
  99. }
  100.  
  101. #gc-search-btn div.goog-inline-block.goog-button-base-outer-box div.goog-inline-block.goog-button-base-inner-box div.goog-button-base-pos div.goog-button-base-content {
  102. height: 23px !important;
  103. padding-top: 2px !important;
  104. padding-left: 15px !important;
  105. padding-right: 15px !important;
  106.  
  107. }
  108.  
  109. #gc-search-btn {
  110. left: -8px !important;
  111. position: relative !important;
  112. margin: 0 !important;
  113. z-index: 5 !important;
  114. border-right: 0px !important;
  115. text-shadow: #fff 0 1px 0 !important;
  116. }
  117.  
  118. #gc-search-btn div {
  119. -webkit-border-top-right-radius: 5px;
  120. -webkit-border-bottom-right-radius: 5px;
  121. border-right: #959595 !important;
  122. }
  123.  
  124. .gc-inbox-sidebar-header,.gc-inbox-view-header {
  125. background-color:#bcf !important;
  126. border-top: 1px solid #def !important;
  127. }
  128.  
  129. .gc-inbox-sidebar-header {
  130. background: -webkit-gradient(
  131. linear,
  132. left bottom,
  133. left top,
  134. color-stop(1, rgba(255,255,255,1)),
  135. color-stop(0.5, #e3e3e3),
  136. color-stop(0.5, #eee),
  137. color-stop(0, #e3e3e3)
  138. ) !important;
  139. padding: 0px !important;
  140. height: 26px !important;
  141. border-bottom: 1px solid #ccc !important;
  142. position: absolute !important;
  143. width: 169px !important;
  144. z-index: 90 !important;
  145. bottom: 0px !important;
  146. border-top: 1px solid #62687b !important;
  147. }
  148.  
  149. .gc-inbox-sidebar-header .goog-button-base > * {
  150. border: 0px !important;
  151. }
  152.  
  153. .gc-inbox-sidebar-header .goog-button-base-content {
  154. height: 22px !important;
  155. padding: 2px 5px !important;
  156. }
  157.  
  158. .gc-inbox-sidebar-header .goog-button-base-inner-box {
  159. border-right: 1px solid #aaa !important;
  160. }
  161.  
  162. .gc-inbox-view-header {
  163. padding-left: 5px !important;
  164. }
  165.  
  166. .goog-splitpane-handle {
  167. border-top: 1px solid #def !important;
  168. }
  169.  
  170. .gc-inbox-search-banner {
  171. background: -webkit-gradient(
  172. linear,
  173. left bottom,
  174. left top,
  175. color-stop(1, rgb(177,255,177)),
  176. color-stop(0.48, rgb(177,255,177)),
  177. color-stop(0.48, rgb(207,255,207)),
  178. color-stop(0, rgb(157,235,157))
  179. );
  180. border-top: 1px solid #fff !important;
  181. z-index: 70 !important;
  182. }
  183.  
  184. #gc-view-loading table tbody tr td.gc-rounded-mm.gc-rounded-bg.gc-status-text {
  185. -webkit-border-radius: 20px;
  186. background: -webkit-gradient(
  187. linear,
  188. left bottom,
  189. left top,
  190. color-stop(0, rgba(0,0,0,0.9)),
  191. color-stop(1, rgba(100,100,100,1))
  192. ) !important;
  193. padding: 6px 14px !important;
  194. margin-bottom: 0px !important;
  195. text-shadow: #000 0 1px 1px !important;
  196. color: #fff !important;
  197. font-weight: normal !important;
  198. font-style: normal !important;
  199. z-index: 60 !important;
  200. position: absolute !important;
  201. top: 100px !important;
  202. font-size: 20px !important;
  203. -webkit-box-shadow: #000 0 1px 4px;
  204. }
  205.  
  206. a#gc-header-did-link.gc-under , #gc-gaia-bar div.gc-header-right b, #gc-gaia-bar div.gc-header-right a {
  207. color: #eee !important;
  208. font-weight: normal !important;
  209. font-style: normal !important;
  210. text-shadow: rgba(0,0,0,0.5) 0 1px 2px !important;
  211. text-decoration: none !important;
  212. display: inline-block !important;
  213. }
  214.  
  215. #gc-gaia-bar div.gc-header-right a {
  216. background: rgba(255,255,255,0.08) !important;
  217. padding: 2px 3px !important;
  218. -webkit-border-radius: 3px;
  219. }
  220.  
  221. #gc-gaia-bar div.gc-header-right a:hover {
  222. color: #fff !important;
  223. background: rgba(255,255,255,0.28) !important;
  224. }
  225.  
  226. #gc-view-loading td {
  227. background: none !important;
  228. }
  229.  
  230. .gc-contact-ac {
  231. -webkit-box-shadow: rgba(0,0,0,0.3) 0 2px 4px;
  232. border: 1px solid #fff !important;
  233. -webkit-border-bottom-left-radius: 5px;
  234. -webkit-border-bottom-right-radius: 5px;
  235. -webkit-border-top-right-radius: 5px;
  236. margin-left: 5px !important;
  237. width: 278px !important;
  238. z-index: 6 !important;
  239. background: #fff !important;
  240. }
  241.  
  242. .gc-contact-ac > * {
  243. -webkit-border-radius: 3px;
  244. color: #888 !important;
  245. }
  246.  
  247. .gc-contact-ac b.ac-highlighted {
  248. -webkit-border-radius: 5px;
  249. color: #316688 !important;
  250. }
  251.  
  252. .gc-contact-ac .active {
  253. background: #daeaf3 !important;
  254. }
  255.  
  256. .gc-contact-ac .ac-row {
  257. font-size: 14px !important;
  258. text-shadow: #fff 0 1px 1px !important;
  259. padding: 4px 5px !important;
  260. margin: 2px !important;
  261. }
  262.  
  263. .gc-contact-card2, .gc-contact-card-data {
  264. z-index: 6 !important;
  265. -webkit-border-bottom-left-radius: 5px;
  266. -webkit-border-bottom-right-radius: 5px;
  267. -webkit-border-top-right-radius: 5px;
  268. border: none;
  269. width: 270px !important;
  270. -webkit-box-shadow: rgba(0,0,0,0.3) 0 2px 4px;
  271. }
  272.  
  273. #gc-contact-card2.goog-shadow {
  274. width: 278px !important;
  275. }
  276.  
  277. span.gc-contact-card-name {
  278. font-size: 14px !important;
  279. color: #316688 !important;
  280. }
  281.  
  282. .gc-contact-card-data-left {
  283. width: 200px !important;
  284. margin-right: 0px !important;
  285. }
  286.  
  287. .gc-contact-card-data-right {
  288. border-bottom-width: 0px !important;
  289. padding-bottom: 19px !important;
  290. }
  291.  
  292. .gc-contact-card2 {
  293. margin-left: 5px !important;
  294. text-shadow: #fff 0 1px 1px !important;
  295. }
  296.  
  297. div.gc-contact-card-data-right img {
  298. -webkit-box-reflect: below 1px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.7, transparent), to(rgba(255,255,255,0.3))) !important;
  299. -webkit-border-radius: 3px !important;
  300. }
  301.  
  302. div.gc-contact-card-sub {
  303. color: #888 !important;
  304. }
  305.  
  306. .gc-contact-card-sub2 {
  307. color: #51884d !important;
  308. display: inline-block !important;
  309. text-indent: -4px !important;
  310. padding-right: 3px !important;
  311. padding-bottom: 1px !important;
  312. overflow: hidden !important;
  313. -webkit-border-radius: 3px !important;
  314. background: #dbf3da !important;
  315. font-size: 11px !important;
  316. margin-left: 5px !important;
  317. }
  318.  
  319. .gc-contact-card2 .goog-shadow-0, .gc-contact-card2 .goog-shadow-1, .gc-contact-card2 .goog-shadow-2, .gc-contact-card2 .goog-shadow-3, .gc-contact-card2 .goog-shadow-4, .gc-contact-card2 .goog-shadow-5, .gc-contact-card2 .goog-shadow-6, .gc-contact-card2 .goog-shadow-7 {
  320. display: none !important;
  321. }
  322.  
  323. .goog-tab {
  324. color: #627093 !important;
  325. text-decoration: none !important;
  326. padding-left: 8px !important;
  327. padding-right: 8px !important;
  328. }
  329.  
  330. .goog-option.gc-inbox-sidebar-item.goog-menuitem.goog-option-selected {
  331. background: -webkit-gradient(
  332. linear,
  333. left bottom,
  334. left top,
  335. color-stop(1, rgb(127,167,215)),
  336. color-stop(0.5, rgb(87,117,175)),
  337. color-stop(0.5, rgb(107,147,185)),
  338. color-stop(0, rgb(107,137,175))
  339. ) !important;
  340. text-shadow: rgba(46,99,144,0.63) 0 -1px 0 !important;
  341. }
  342.  
  343.  
  344.  
  345. .goog-option.gc-inbox-sidebar-item.goog-menuitem-highlight {
  346. background: #e2e5f1 !important;
  347. }
  348.  
  349. .gc-inbox-sidebar-menu,.gc-inbox-sidebar-types-header,.gc-inbox-sidebar-types-menu,.gc-sidebar-contact-menu {
  350. background: #e2e5f1 !important;
  351. -webkit-box-shadow: none !important
  352. }
  353.  
  354. .goog-menu {
  355. -webkit-box-shadow: rgba(0,0,0,0.4) 0 1px 4px;
  356. }
  357.  
  358. .gc-inbox-sidebar-menu {
  359. border-bottom-color: #cad0e7 !important;
  360. }
  361.  
  362. #gc-sidebar-invite-header {
  363. border-top-width: 0px !important;
  364. }
  365.  
  366. #gc-sidebar-invites a {
  367. color: #7c839b !important;
  368. display: block !important;
  369. text-align: center !important;
  370. margin-right: 8px !important;
  371. padding: 2px 5px !important;
  372. text-decoration: none !important;
  373. -webkit-border-radius: 3px !important;
  374. background: #cbd1e5 !important;
  375. }
  376.  
  377. div.gc-bubble, div.gc-bubble > td, .gc-bubble-layout tr td div.gc-bgimg {
  378. background: none !important;
  379. border: 0px !important;
  380. }
  381.  
  382.  
  383. .goog-bubble-close-button {
  384. background-image: url(http://grab.by/1pYQ) !important;
  385. background-color: transparent !important;
  386. width: 29px !important;
  387. height: 28px !important;
  388. right: 1px !important;
  389. top: -9px !important;
  390. display: block !important;
  391.  
  392. }
  393.  
  394. td.gc-bubble-mc {
  395. background: rgba(0,0,0,0.93) !important;
  396. -webkit-border-radius: 5px;
  397. padding: 10px !important;
  398. display: block !important;
  399. color: #fff !important;
  400. text-shadow: #000000 0 1px 1px;
  401. -webkit-box-shadow: #000 0 2px 4px;
  402. border: 1px solid rgba(255,255,255,0.62) !important;
  403. }
  404.  
  405. td.gc-bubble-mc div.goog-flat-menu-button {
  406. text-shadow: none !important;
  407. }
  408.  
  409. td.gc-bubble-mc .goog-button div {
  410. background: none !important;
  411. border: 0px !important;
  412. color: #fff !important;
  413. }
  414.  
  415. td.gc-bubble-mc .goog-button {
  416. background: -webkit-gradient(
  417. linear,
  418. left bottom,
  419. left top,
  420. color-stop(1, rgb(130,130,130)),
  421. color-stop(0.5, rgb(90,90,90)),
  422. color-stop(0.5, rgb(120,120,120)),
  423. color-stop(0, rgb(60,60,60))
  424. ) !important;
  425. -webkit-border-radius: 3px;
  426. }
  427.  
  428. .gc-bubble-mc img.gc-help-call.gc-help-button {
  429. display: none !important;
  430. }
  431.  
  432. div.gc-bgimg.gc-bubble-callout {
  433. display: none !important;
  434. }
  435.  
  436. #gc-inbox-sidebar-invites-left {
  437. display: none !important;
  438. }
  439.  
  440. #gc-sidebar-balance {
  441. display: block !important;
  442. position: fixed !important;
  443. bottom: 28px !important;
  444. z-index: 50 !important;
  445. left: 0px !important;
  446. width: 169px !important;
  447. border-top: 1px solid #737990 !important;
  448. padding-top: 0px !important;
  449. background-color: #adcd6d !important;
  450. }
  451.  
  452. #gc-sidebar-balance div {
  453. padding-left: 0px !important;
  454. }
  455.  
  456. #gc-sidebar-billing-actions {
  457. margin-left: 8px !important;
  458. }
  459.  
  460. #gc-sidebar-billing-actions a {
  461. background-color: #adcd6d !important;
  462. -webkit-border-radius: 0px !important;
  463. display: inline !important;
  464. }
  465.  
  466. #gc-sidebar-balance > * {
  467. background-color: #adcd6d !important
  468. }
  469.  
  470. div#gc-sidebar-balance-header.gc-inbox-sidebar-types-header.gc-sidebar-contacts-header {
  471. display: none !important;
  472. }
  473.  
  474. #gc-sidebar-currency {
  475. font-size: 20px !important;
  476. text-shadow: #c6e980 0 1px 1px;
  477. color: #445411 !important;
  478. background: #97a3b7 !important;
  479. display: block !important;
  480. margin: 0px !important;
  481. padding: 8px 8px !important;
  482. background: -webkit-gradient(
  483. linear,
  484. left bottom,
  485. left top,
  486. color-stop(0, rgb(111,138,21)),
  487. color-stop(0.5, rgb(161,194,64)),
  488. color-stop(0.5, rgb(179,214,102)),
  489. color-stop(1, rgb(221,255,158))
  490. ) !important;
  491. -webkit-border-radius: 0px !important;
  492. border-bottom: 1px solid #52740e;
  493. border-top: 1px solid #fff;
  494. }
  495.  
  496. #gc-sidebar-currency:hover {
  497. background: -webkit-gradient(
  498. linear,
  499. left bottom,
  500. left top,
  501. color-stop(0, rgb(101,128,11)),
  502. color-stop(0.5, rgb(151,184,54)),
  503. color-stop(0.5, rgb(169,204,92)),
  504. color-stop(1, rgb(211,245,148))
  505. ) !important;
  506. text-decoration: none !important;
  507. }
  508.  
  509. div#gc-sidebar-billing-actions > * {
  510. color: #647835 !important;
  511. border-color: #a2b38f !important;
  512. }
  513.  
  514. .goog-option.gc-inbox-sidebar-item {
  515. background: #e2e5f1 !important;
  516. }
  517.  
  518. td.goog-splitpane-first-container {
  519. display: block !important;
  520. position: absolute !important;
  521. top: 0px !important;
  522. border-right: 1px solid #8e9097 !important;
  523. height: 100% !important;
  524. overflow: visible !important;
  525. background-color: #e2e5f1 !important;
  526. -webkit-box-shadow: #000 -1px 0px 5px !important;
  527. z-index: 20 !important;
  528. width: 170px !important;
  529. }
  530.  
  531. td.goog-splitpane-first-container > * {
  532. background: #e2e5f1 !important;
  533. }
  534.  
  535. td.goog-splitpane-second-container {
  536. margin-left: 700px !important;
  537. position: relative !important;
  538. }
  539.  
  540. td.goog-splitpane-handle {
  541. display: none !important;
  542. }
  543.  
  544.  
  545. .goog-tab-selected {
  546. padding-left: 7px !important;
  547. padding-right: 7px !important;
  548. color: #000 !important;
  549. -webkit-border-top-left-radius: 5px;
  550. -webkit-border-top-right-radius: 5px;
  551. background: -webkit-gradient(
  552. linear,
  553. left bottom,
  554. left top,
  555. color-stop(1, rgb(255,255,255)),
  556. color-stop(0.94, rgb(227,227,255)),
  557. color-stop(0, rgb(255,255,255))
  558. ) !important;
  559. font-weight: normal !important;
  560. font-style: normal !important;
  561. }
  562.  
  563. #gc-view-title {
  564. text-shadow: #fff 0 1px 1px !important;
  565. color: #6378b9 !important;
  566. font-weight: normal !important;
  567. font-style: normal !important;
  568. margin-top: 6px !important;
  569. padding: 3px 8px!important;
  570. background: -webkit-gradient(
  571. linear,
  572. left bottom,
  573. left top,
  574. color-stop(1, rgb(255,255,255)),
  575. color-stop(0, rgb(235,239,249))
  576. ) !important;
  577. -webkit-border-top-left-radius: 7px;
  578. -webkit-border-top-right-radius: 7px;
  579. }
  580.  
  581. #gc-inbox-actions-header .goog-button-base div {
  582. background: none !important;
  583. border: 0px !important;
  584. color: #8ea2da !important;
  585. }
  586.  
  587. #gc-inbox-actions-header .goog-button-base {
  588. text-decoration: none !important;
  589. padding: 1px 1px !important;
  590. background-color: #dce5ff !important;
  591. color: #8ea2da !important;
  592. -webkit-border-radius: 3px !important;
  593. font-size: 11px !important;
  594. text-shadow: rgba(255,255,255,0.87) 0 1px 0 !important;
  595. margin-right: 2px !important;
  596. border: 1px solid #a4b9f6 !important;
  597. }
  598.  
  599. a#gc-inbox-refresh.gc-inbox-refresh {
  600. text-decoration: none !important;
  601. display: inline-block !important;
  602. padding: 4px 5px !important;
  603. background-color: #c8e7dd !important;
  604. color: #789982 !important;
  605. -webkit-border-radius: 3px !important;
  606. font-size: 11px !important;
  607. text-shadow: rgba(255,255,255,0.87) 0 1px 0 !important;
  608. border: 1px solid #a4b9f6 !important;
  609. }
  610.  
  611. #gc-view-notification {
  612. z-index: 99 !important;
  613. top: 70px !important;
  614. }
  615.  
  616. .modal-dialog-bg {
  617. z-index: 140 !important;
  618. background-repeat: repeat;
  619. }
  620.  
  621. .gc-contact-card2 .gc-contact-card-data .gc-contact-card-sub a {
  622. color: #557588 !important;
  623. font-size: 11px !important;
  624. text-decoration: none !important;
  625. display: inline-block !important;
  626. padding: 0px 4px 1px 4px !important;
  627. background: #daeaf3 !important;
  628. -webkit-border-radius: 3px !important;
  629. }
  630.  
  631. .gc-contact-card-title a {
  632. font-size: 11px !important;
  633. text-decoration: none !important;
  634. display: inline-block !important;
  635. padding: 0px 4px 1px 4px !important;
  636. background-color: #efefef !important;
  637. color: #a1a1a1 !important;
  638. -webkit-border-radius: 3px !important;
  639. }

URL: googlevoiceuserstyle

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.