Dark Github Inputs by riedler

Dark Github Inputs screenshot
Homepage Install Get Stylus Write a review

Details

Authorriedler

LicenseCC BY-SA 4.0

Created atApril 09, 2021 09:04

Updated atApril 09, 2021 09:45

Applies tohttps://github.com/

Statistics

Learn how we calculate statistics in the FAQ.

Total views134

Total installs31

Weekly installs1

Weekly updates2

Description

Styles the inputs in github dark, because the github webdevs forgot to style those. Also styles scrollbar and text selection.

Notes

Version: 0.2.0
Changelog:
- migrated to stylus-lang

History

Daily snapshots of style statistics.

2021-07-072021-07-212021-08-032021-08-172021-08-302021-09-122021-09-262021-10-092021-10-222021-11-052021-11-182021-12-01Date0.000.501.001.502.002.503.003.504.00Daily countDaily installsDaily updatesDaily views
2021-07-072021-07-212021-08-032021-08-172021-08-302021-09-122021-09-262021-10-092021-10-222021-11-052021-11-182021-12-01Date0.0018.0035.0053.0070.0088.00105.00123.00140.00Total countTotal installsTotal views

Source code

/* ==UserStyle==
@name           Dark github inputs
@namespace      https://RiedleroD/userstyles-riedler/
@version        0.2.0
@description    Styles the inputs in github dark, because the github webdevs forgot to style those. Also styles scrollbar and text selection.
@author         Riedler
@preprocessor	stylus
@var	text		font	"Symbol rendering font"	"FontAwesome,sans-serif"
@var	checkbox	scrb	"Scrollbar"				1
@var	checkbox	slc		"Selections"			1
@var	checkbox	chk		"Checkboxes"			1
@var	checkbox	rad		"Radios"				1
==/UserStyle== */

@-moz-document domain("github.com"){
	if slc{
		::selection{
			background-color:var(--color-state-selected-primary-bg);
			color:var(--color-state-selected-primary-text);}
	}
	if scrb{
		::-webkit-scrollbar,::-webkit-scrollbar-track-piece{
			background-color:var(--color-bg-primary) !important;}
		::-webkit-scrollbar-corner,::-webkit-scrollbar-thumb{
			background-color:var(--color-btn-bg) !important;
			border-radius:0.4em;}
		:root{/*Because Firefox doesn't have the ::-moz-scrollbar selectors*/
			scrollbar-width:thin;
			scrollbar-color:var(--color-btn-bg) var(--color-bg-primary);}
	}
	if chk{
		input[type="checkbox"]{
			appearance:none;
			height:1rem;
			width:1rem;
			background-color:#0000;
			border:solid 1px var(--color-text-secondary);
			color:var(--color-text-primary);
			border-radius:0.2rem;
			cursor:pointer;
			&:checked,
			&:indeterminate{
				background-color:var(--color-state-selected-primary-bg);
				border-color:var(--color-state-selected-primary-border);
			}
			&::after{
				display:flex;
				width:1rem;
				height:1rem;
				align-items:center;
				justify-content:center;
				margin:-1px 0 0 -1px;
				font:normal 1rem font;
			}
			&:checked::after{
				content:"✔";
			}
			&:indeterminate:after{
				content:"━";
			}
		}
	}
	if rad{
		input[type="radio"]{
			appearance:none;
			height:1rem;
			width:1rem;
			background-color:#0000;
			border:solid 1px  var(--color-text-secondary);
			color:var(--color-state-selected-primary-text);
			border-radius:100%;
			cursor:pointer;
			&:checked{
				background:radial-gradient(var(--color-text-primary) 35%,var(--color-state-selected-primary-bg) 45%);
				border-color:var(--color-state-selected-primary-border);
			}
		}
	}
}

Reviews

No reviews yet.