Skip to content

Google Docs 2010-11 Rewritten by ivyclaw22

Screenshot of Google Docs 2010-11 Rewritten

Details

Authorivyclaw22

LicenseNo License

Categorygoogle

Created

Updated

Size69 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Hi! I have decided to do a rewrite of my "google docs 2010-11" style. this version is much better made and has a few more features;

Notes

Updates:
1-19-24: released
-added Comments
-improved icon support
-buttons
1-19-24: added tooltips
1-19-24: added a basic theme to the google drawings ui(WIP), fixed a few toolbar bugs
5-5-24: made a few tweaks related to the share button and the pub dilouge

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name           google docs 2010-11 rewritten
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */
@-moz-document url-prefix("https://docs.google.com/document/d/") {
	/*going to make things 100% less annoying*/
	* {
		letter-spacing: normal!important
	}
	/* Okay... I have decided to try this again */
	/*my last attempt was spaghetti and I think I could do better*/
	#fontSizeIncrement, #fontSizeSelect, #fontSizeDecrement, #fontSizeSelectSeparator, .onegoogle-material-minibar, .left-sidebar-container, #kix-vertical-ruler-container, .docs-companion-app-switcher-container, #docs-omnibox-toolbar {
		display: none
	}
	/*hiding the hard to/unstylable parts*/
	/*base styling/body*/
	body.docs-gm {
		background-color: white;
		color: black;
		font-family: Arial, sans-serif, sans;
		font-size: 13px;
		margin: 0
	}
	/*topbars basic styling/structure*/
	#docs-banner-container, #docs-header-container {
		display: block;
	}
	.docs-material #docs-header #docs-titlebar-container {
		max-height: 100%;
		margin-left: 0px;
	}
	#docs-titlebar-container {
		position: static;
	}
	.docs-material #docs-header #docs-titlebar {
		clear: both;
		font-size: 13px;
		height: 44px;
		margin-top: -1px;
		width: 100%;
		padding: 0!important
	}
	.docs-grille-gm3 #docs-header {
		height: unset !important;
	}
	.docs-grille-gm3 .docs-material #docs-header .docs-titlebar-buttons {
		padding: 0 7px;
		height: 44px!Important;
	}
	.docs-title-outer {
		padding-top: 6px
	}
	.docs-grille-gm3 .docs-title-input {
		border-radius: 0!important;
		border: 1px solid #fff;
	}
	.docs-grille-gm3 .docs-title-input:hover {
		border-color: #fff;
	}
	.docs-grille-gm3 .docs-title-input:focus {
		background-color: #ffffd6;
		cursor: pointer;
	}
	.docs-grille-gm3 .docs-title-untitled .docs-title-input, .docs-grille-gm3 .docs-title-input:focus, .docs-grille-gm3 .docs-title-input:hover {
		border-color: #ccc;
		border-top-color: #aaa
	}
	.scb-quick-actions-menu-button {
		display: none!important
	}
	/*adding better (google translate) buttons for scb 5/5/24 (Happy cinco de mayo!)*/
	.docs-grille-gm3 #docs-titlebar-share-client-button .jfk-button.jfk-button-hover, .docs-grille-gm3 #scb-quick-actions-menu-button.goog-flat-menu-button.goog-flat-menu-button-hover {
		font-size: 13px;
		letter-spacing: normal
	}
	.docs-grille-gm3 #docs-titlebar-share-client-button .jfk-button:focus, .docs-grille-gm3 #scb-quick-actions-menu-button.goog-flat-menu-button:focus, .docs-grille-gm3 #docs-titlebar-share-client-button .jfk-button.jfk-button-hover:focus, .docs-grille-gm3 #scb-quick-actions-menu-button.goog-flat-menu-button.goog-flat-menu-button-hover:focus{
		border-color: orange!important;
		background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#ddd));
		background: -moz-linear-gradient(top, #fff, #ddd);
		height: auto;
		font: normal normal normal 13px/13px Arial, sans-serif;
	}
	.docs-grille-gm3 #docs-titlebar-share-client-button .scb-split-button.jfk-button, .docs-grille-gm3 #docs-titlebar-share-client-button .scb-split-button.jfk-button-disabled, .docs-grille-gm3 #docs-titlebar-share-client-button .scb-split-button.jfk-button.jfk-button-active, .docs-grille-gm3 #docs-titlebar-share-client-button .scb-split-button.jfk-button.jfk-button-checked, .docs-grille-gm3 #docs-titlebar-share-client-button .scb-split-button.jfk-button.jfk-button-hover, .docs-grille-gm3 #docs-titlebar-share-client-button .scb-split-button.jfk-button.jfk-button-hover:focus, .docs-grille-gm3 #docs-titlebar-share-client-button .scb-split-button.jfk-button:focus {
		padding: 3px 8px 5px;
		border-radius: 2px;
	}
	.docs-grille-gm3 #docs-titlebar-share-client-button .jfk-button, .docs-grille-gm3 #scb-quick-actions-menu-button.goog-flat-menu-button {
		height: auto;
		border-width: 1px!important;
		border-style: solid!important;
		border-color: #bbb #999 #999 #bbb!important;
		background: #eee;
		background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#ddd));
		background: -moz-linear-gradient(top, #fff, #ddd);
		box-sizing: content-box;
		font: normal normal normal 13px/13px Arial, sans-serif;
		color: #000
	}
	.docs-grille-gm3 #docs-titlebar-share-client-button .jfk-button.jfk-button-active, .docs-grille-gm3 #docs-titlebar-share-client-button .jfk-button.jfk-button-checked, .docs-grille-gm3 #scb-quick-actions-menu-button.goog-flat-menu-button.goog-flat-menu-button-active {
		color: #000;
		background-color: #ccc;
		border-color: #999 #bbb #bbb #999!important;
		background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ddd), to(#fff))!important;
		background-image: -moz-linear-gradient(top, #ddd, #fff);
		filter: progid:DXImageTransform.Microsoft.Gradient(EndColorstr='#ffffff', StartColorstr='#dddddd', GradientType=0);
		height: auto;
		font: normal normal normal 13px/13px Arial, sans-serif;
	}
	.docs-grille-gm3 #docs-titlebar-share-client-button .jfk-button.jfk-button-hover, .docs-grille-gm3 #scb-quick-actions-menu-button.goog-flat-menu-button.goog-flat-menu-button-hover {
		border-color: #9cf #69e #69e #7af!important;
		height: auto;
		background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#ddd));
		background: -moz-linear-gradient(top, #fff, #ddd);
		font: normal normal normal 13px/13px Arial, sans-serif;
	}
	.apps-share-sprite {
		background-image: url(https://ssl.gstatic.com/docs/documents/share/images/icons-7.png);
	}
	.docs-grille-gm3 .scb-public-s900,
	.scb-gm3 .scb-public-s900 {
		background-position: -304px 0
	}
	.docs-grille-gm3 .scb-lock-s900,
	.scb-gm3 .scb-lock-s900 {
		background-position: -368px 0
	}
	.docs-grille-gm3 .scb-domain-s900,
	.scb-gm3 .scb-domain-s900 {
		background-position: -336px 0
	}
	.docs-grille-gm3 .scb-people-s900,
	.scb-gm3 .scb-people-s900 {
		background-position: -320px 0
	}
	.scb-person-add-s900 {
		background-position: 0px 0px
	}
	.docs-grille-gm3 #docs-menubars {
		height: auto !important;
		margin-top: 0px;
		transition-duration: .1s;
	}
	#docs-menubars/*historical innaccuracy, but much less painful to deal with*/
	/*ok ill explain*/
	/*you know the share button i just worked on? hard work*/
	/*problem is, if i use the traditional method of getting this to work,(docs-menubar), it will mess with the responsive design elements and generate the "small screens" share button with no text*/
	/*this is mercy*/
	{
		margin: 0;
		background: #e3e9ff;
		border-top: 2px solid #bcf;
		cursor: default;
		font: 13px Arial, sans-serif;
	}
	.goog-toolbar, .goog-menu {
		font: 12px arial, sans-serif;
		font-size: 12px;
		line-height: normal;
	}
	.docs-grille-gm3 .docs-menubar {
		height: auto;
	}
	.docs-grille-gm3 .docs-material #docs-menubar, .docs-grille-gm3 .docs-material #docs-titlebar-container {
		margin-left: 0px;
	}
	#docs-notice {
		display: none
	}
	.docs-grille-gm3 .docs-menubar .goog-control {
		margin-bottom: 0px;
		margin-top: 0px;
		padding: 5px 8px;
		overflow: hidden;
		vertical-align: text-bottom;
		border-radius: 0;
		border: 0;
	}
	.docs-grille-gm3 .docs-menubar .goog-control-hover, .docs-grille-gm3 .docs-menubar .goog-control-open {
		background: #68e;
		border: 1px solid #68e;
		color: #fff!important;
		padding: 4px 7px
	}
	.docs-grille-gm3.docs-gm .docs-material #docs-toolbar-wrapper {
		margin: 0;
		min-height: 0px;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #ccc;
		border-radius: 0;
		padding: 2px;
		background: #fafafa url(https://ssl.gstatic.com/editor/toolbar-bg.png) repeat-x bottom left;
		width: 100%!important
	}
	.docs-grille-gm3 .docs-main-toolbars .goog-toolbar-button {
		background: unset;
		border-radius: 0px;
		height: auto;
		line-height: normal;
		min-width: 0px;
		border: 0;
		margin: 0 2px;
	}
	.docs-grille-gm3.docs-gm .docs-main-toolbars .goog-toolbar-button-hover {
		background: unset
	}
	.goog-toolbar-button-outer-box, .goog-toolbar-button-inner-box {
		border: 0;
		vertical-align: top
	}
	.goog-toolbar-button-outer-box {
		margin: 0;
		padding: 1px 0
	}
	.goog-toolbar-button-inner-box {
		margin: 0 -1px;
		padding: 3px 4px
	}
	.docs-grille-gm3 .docs-main-toolbars .goog-toolbar-menu-button-inner-box {
		margin: 0 -1px;
		padding: 3px 4px
	}
	.docs-grille-gm3 .docs-main-toolbars .goog-toolbar-button-inner-box, .docs-grille-gm3 .docs-main-toolbars .goog-toolbar-menu-button-inner-box {
		height: auto;
		min-width: 0px;
	}
	.goog-toolbar-button-hover .goog-toolbar-button-outer-box, .goog-toolbar-button-active .goog-toolbar-button-outer-box, .goog-toolbar-button-checked .goog-toolbar-button-outer-box, .goog-toolbar-button-selected .goog-toolbar-button-outer-box {
		border-width: 1px 0;
		border-style: solid;
		padding: 0
	}
	.goog-toolbar-button-hover .goog-toolbar-button-inner-box, .goog-toolbar-button-active .goog-toolbar-button-inner-box, .goog-toolbar-button-checked .goog-toolbar-button-inner-box, .goog-toolbar-button-selected .goog-toolbar-button-inner-box {
		border-width: 0 1px;
		border-style: solid;
		padding: 3px
	}
	.docs-toolbar-text-button .goog-toolbar-button-outer-box, .docs-toolbar-text-button .goog-toolbar-menu-button-outer-box {
		padding-left: 0px;
	}
	.goog-toolbar-button-hover .goog-toolbar-button-outer-box, .goog-toolbar-button-hover .goog-toolbar-button-inner-box {
		border-color: #a1badf!important
	}
	.goog-toolbar-button-active, .goog-toolbar-button-checked, .goog-toolbar-button-selected, .goog-toolbar-menu-button-active {
		background-color: #dde1eb!important
	}
	.goog-toolbar-button-active .goog-toolbar-button-outer-box, .goog-toolbar-button-active .goog-toolbar-button-inner-box, .goog-toolbar-button-checked .goog-toolbar-button-outer-box, .goog-toolbar-button-checked .goog-toolbar-button-inner-box, .goog-toolbar-button-s...

Reviews

No reviews yet.