Last active
December 15, 2015 11:39
-
-
Save davidl/5254613 to your computer and use it in GitHub Desktop.
Add some HTTP status cats to your Chrome Dev Tools Network panel by adding these lines to your Custom.css file. Check out https://github.com/bentruyman/devtools-themes for more.
This file contains 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
#-webkit-web-inspector .status-column { | |
overflow: visible !important; | |
} | |
#-webkit-web-inspector .status-column [title] { | |
overflow: visible !important; | |
position: relative !important; | |
} | |
#-webkit-web-inspector .status-column [title]::before { | |
border-color: transparent transparent #000 transparent !important; | |
border-style: solid !important; | |
border-width: 10px !important; | |
bottom: -10px !important; | |
height: 0 !important; | |
left: 10px !important; | |
width: 0 !important; | |
} | |
#-webkit-web-inspector .status-column [title]::after { | |
background: #000000 0 0 no-repeat scroll !important; | |
background-image: none !important; | |
background-size: contain !important; | |
bottom: -266px !important; | |
height: 256px !important; | |
left: 0 !important; | |
width: 320px !important; | |
} | |
#-webkit-web-inspector .status-column [title]::after, | |
#-webkit-web-inspector .status-column [title]::before { | |
content: ' ' !important; | |
opacity: 0 !important; | |
pointer-events: none !important; | |
position: absolute !important; | |
transition: all 0.5s ease-out !important; | |
z-index: 1 !important; | |
} | |
#-webkit-web-inspector .status-column [title]:hover::after, | |
#-webkit-web-inspector .status-column [title]:hover::before { | |
opacity: 1 !important; | |
} | |
#-webkit-web-inspector .status-column [title^="100 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7162/6512768893_a821929823_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="101 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7022/6540479029_730c095b63_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="200 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7153/6512628175_6a4e8ab6ba_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="201 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7149/6540221577_ed29955a01_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="202 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7167/6540479079_16e97a624a_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="204 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7154/6547319943_442c6509bb_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="206 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7021/6514473163_4e2a681cbd_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="207 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7141/6514472979_c44518c4ce_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="300 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7019/6519540181_d4eae6ee7a_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="301 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7022/6519540231_73756bac6c_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="302 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7019/6508023829_3d44c4ac16_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="303 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7007/6513125065_ef7cfa6256_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="304 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7166/6540551929_eeee6bf3dd_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="305 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7002/6540365403_01e93b44a3_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="307 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7161/6513001269_edff1f0079_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="400 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7022/6540669737_7527a5de13_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="401 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7148/6508023065_8dae48a30b_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="402 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7165/6513001321_8ecc400e0a_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="403 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7173/6508023617_f3ffc34e17_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="404 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7172/6508022985_b22200ced0_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="405 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7175/6508023523_996188af86_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="406 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7143/6508023119_b681209a58_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="408 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7018/6508023179_bab3eebce8_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="409 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7010/6508023259_b1c6f5a353_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="410 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7145/6514567755_1c5b7f575f_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="411 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7159/6540724141_7d78eae062_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="413 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7161/6508023747_1d60889626_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="414 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7152/6508023351_6732ed2f58_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="416 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7151/6513196851_10ef1d190e_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="417 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7009/6508023679_cb3e88fa92_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="418 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7006/6508102407_a4de65687b_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="422 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7004/6514473085_3c996d9594_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="423 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7150/6514510235_8c2ee4965e_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="424 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7165/6514584423_a9b13d6b70_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="425 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7013/6540586787_c7182a2bc1_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="426 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7167/6509400771_33a1f59890_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="429 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7152/6509400997_25bb1bb4fb_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="431 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7144/6509400689_a67d026d0a_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="444 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7152/6509400599_52ca022f98_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="450 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7151/6513125123_dd582f5c2a_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="500 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7001/6509400855_aaaf915871_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="502 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7158/6508023429_735b433a36_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="503 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7157/6540643319_7945715c3a_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="506 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7155/6540643279_d5126cd8f6_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="507 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7160/6509400503_648dc8a2e5_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="508 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7025/6509400445_5fd9c7a9c3_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="509 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7154/6540399865_7bb98e69d2_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="599 "]::after { | |
background-image: url(http://farm8.staticflickr.com/7033/6509400929_57ec73af05_n.jpg) !important; | |
} | |
#-webkit-web-inspector .status-column [title^="206 "]::after, | |
#-webkit-web-inspector .status-column [title^="300 "]::after, | |
#-webkit-web-inspector .status-column [title^="304 "]::after, | |
#-webkit-web-inspector .status-column [title^="307 "]::after, | |
#-webkit-web-inspector .status-column [title^="414 "]::after, | |
#-webkit-web-inspector .status-column [title^="422 "]::after, | |
#-webkit-web-inspector .status-column [title^="509 "]::after { | |
bottom: -330px !important; | |
height: 320px !important; | |
width: 256px !important; | |
} | |
#-webkit-web-inspector .status-column [title="(pending)"]::after { | |
background-image: url('http://25.media.tumblr.com/tumblr_l7rdesD07L1qz4s4wo1_400.gif') !important; | |
border: 1px solid #000 !important; | |
bottom: -229px !important; | |
height: 219px !important; | |
width: 293px !important; | |
} | |
#-webkit-web-inspector .status-column [title="Success"]::after { | |
background-image: url('http://mlkshk.com/r/P44J') !important; | |
border: 1px solid #000 !important; | |
bottom: -260px !important; | |
height: 250px !important; | |
width: 300px !important; | |
} | |
#-webkit-web-inspector .status-column [title="(canceled)"]::after { | |
background-image: url('http://gifs.gifbin.com/052009/1242926205_keyboard_cat.gif') !important; | |
border: 1px solid #000 !important; | |
bottom: -243px !important; | |
height: 233px !important; | |
width: 308px !important; | |
} | |
#-webkit-web-inspector .status-column [title="(failed)"]::after { | |
background-image: url('http://1.bp.blogspot.com/_JLkdStmKIyk/TTmkVTqKYzI/AAAAAAAAAWU/k6qt_Y7OpNk/s1600/gymnastics-fail-cat.gif') !important; | |
bottom: -295px !important; | |
height: 285px !important; | |
width: 440px !important; | |
} | |
#-webkit-web-inspector .status-column [title^="306 "]::after, | |
#-webkit-web-inspector .status-column [title^="306 "]::before, | |
#-webkit-web-inspector .status-column [title^="407 "]::after, | |
#-webkit-web-inspector .status-column [title^="407 "]::before, | |
#-webkit-web-inspector .status-column [title^="412 "]::after, | |
#-webkit-web-inspector .status-column [title^="412 "]::before, | |
#-webkit-web-inspector .status-column [title^="415 "]::after, | |
#-webkit-web-inspector .status-column [title^="415 "]::before, | |
#-webkit-web-inspector .status-column [title^="420 "]::after, | |
#-webkit-web-inspector .status-column [title^="420 "]::before, | |
#-webkit-web-inspector .status-column [title^="501 "]::after, | |
#-webkit-web-inspector .status-column [title^="501 "]::before, | |
#-webkit-web-inspector .status-column [title^="504 "]::after, | |
#-webkit-web-inspector .status-column [title^="504 "]::before, | |
#-webkit-web-inspector .status-column [title^="505 "]::after, | |
#-webkit-web-inspector .status-column [title^="505 "]::before { | |
display: none !important; | |
} |
Custom.css
is located:
- Mac: ~/Library/Application Support/Google/Chrome/Default/User StyleSheets/Custom.css
- PC: C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css
- Ubuntu (Chromium): ~/.config/chromium/Default/User\ StyleSheets/Custom.css
This file is generated from LESS: https://gist.github.com/davidl/5262611
Screenshot: http://mlkshk.com/r/PN4X
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Also available in rapper form: https://gist.github.com/davidl/5251362