mtness style: firefox quantum responsive design mode

css_mtness-rdm.css

/*
 * mtness RDM adjustments
 * written with the left Hand of mtness 
 * 2018-01-16
 *
 * hast to be referenced in usewrContent.css
 *
 */ 

@-moz-document url("chrome://devtools/content/responsive.html/index.xhtml")
{
	#app { 
		margin: 0 !important;
		padding: 0 0 0 0 !important;
		align-items: left !important; 
		height: calc(100% - 16px) !important;
	}
	
	#global-toolbar {
		display: block !important;
		width: 100% !important;
		position: relative;
		padding: 4px 15px !important;
		box-shadow: unset !important;
	}
	#app #global-toolbar {
		margin-bottom: 1px !important;
	}
	
	#global-network-throttling-selector {
		height: 18px !important;
	}
	#global-dpr-selector > select > option {
		padding: 0 5px !important;
	}

	#global-toolbar > .toolbar-button::before {
	}
	
	#global-touch-simulation-button {
		position: absolute;
		right: 52px;
		top: 2px;
	}
	#global-screenshot-button {
		position: absolute;
		right: 28px;
		top: 2px;
	}
	#global-exit-button {
		position: absolute;
		right: 2px;
		top: 2px;
	}
	
	
	.viewport-dimension {
		position: absolute;
		top: 5px;
		left: 220px;
		z-index: 1;
	}
	
	.viewport-toolbar.container {
		height: 24px !important;
		justify-content: left !important;
	}
	.viewport-rotate-button {
		position: absolute;
		left: 0 !important;
	}
	.viewport-rotate-button.devtools-button:empty::before {
		width: 22px !important;
		height: 22px !important;
	}
	.viewport-device-selector {
		text-align: left !important;
		margin-left: 48px !important;
	}

}

css_mtness-viewsource.css

@-moz-document url-prefix(view-source:) { 
	html { 	
		background-color: #000 !important;
	}
	body#viewsource {
		min-height: 100% !important;
		height: unset !important;
		color: #080 !important;
		font-family:'Lucida Console' !important;
		font-size: small !important;
		font-weight: normal !important;
		white-space: pre !important;
		margin: 0 !important;
		-moz-tab-size: 4;
	}
	#viewsource.wrap {
	}
	pre {
	}
	pre[id]:before,
	span[id]:before {
	  color: #888 !important;
	}
	.highlight .start-tag {
	 color: #4f4 !important;
	 font-weight: normal !important;
	}
	.highlight .end-tag {
	 color: #4f4 !important;
	 font-weight: normal !important;
	}
	.highlight .comment {
	 color: yellow !important;
	 font-style: normal !important;
	}
	.highlight .cdata {
	 color: #CC0066 !important;
	}
	.highlight .doctype {
	 color: #DD80DD !important;
	 font-style: normal !important;
	}
	.highlight .pi {
	 color: orchid !important;
	 font-style: italic !important;
	}
	.highlight .entity {
	 color: #0045FF !important;
	 font-weight: normal !important;
	}
	.highlight .text {
	  font-weight: normal !important;
	}
	.highlight .attribute-name {
	 color: #0c0 !important;
	 font-weight: normal !important;
	}
	.highlight .attribute-value {
	 color: steelblue !important;
	 font-weight: normal !important;
	}
	.highlight .attribute-value[href|="view"] {
	 color: #88f !important;
	}
	.highlight .attribute-value[href|="view"]:hover {
	 color: #bbf !important;
	}
	.highlight .markupdeclaration {
	 color: steelblue !important;
	 font-style: normal !important;
	}
	span:not(.error), a:not(.error) {
	}
	span[id] {
	}
	.highlight .error,
	.highlight .error > :-moz-any(.start-tag, .end-tag, .comment, .cdata, .doctype,
								  .pi, .entity, .attribute-value) {
	  color: red !important;
	  font-weight: normal !important;
	}
	.error > .attribute-name
	{
	  color: green !important;
	}
}

userContent.css

/* ------------------------------------------------------------------------- */
/*
              __                                    __ 
   ____ ___  / /_____  ___  __________  ____  ___  / /_
  / __ `__ \/ __/ __ \/ _ \/ ___/ ___/ / __ \/ _ \/ __/
 / / / / / / /_/ / / /  __(__  )__  ) / / / /  __/ /_  
/_/ /_/ /_/\__/_/ /_/\___/____/____(.)_/ /_/\___/\__/  


userContent.css for mtness firefox

2018-01-16

/* ------------------------------------------------------------------------- */


@import url(./css_mtness-viewsource.css); /**/

@import url(./css_mtness-rdm.css); /**/


@-moz-document url-prefix(about:newtab) { 
	body { background-color:#666 !important; }
}

/* Change width of VERTICAL SCROLLBAR */
scrollbar[orient="vertical"], scrollbar[orient="vertical"] thumb, scrollbar[orient="vertical"] scrollbarbutton { max-width: 10px !important; -moz-appearance: none !important; }

/* Change width of HORIZONTAL SCROLLBAR */
scrollbar[orient="horizontal"], scrollbar[orient="horizontal"] thumb, scrollbar[orient="horizontal"] scrollbarbutton { max-height: 10px !important; -moz-appearance: none !important; }