Skip to content

Instantly share code, notes, and snippets.

@robmosys robmosys/userContent.css
Last active Jun 28, 2019

Embed
What would you like to do?
CSS hack to fake a compack mode in Mocrosoft Teams
/* Only works in firefox */
/* Install to this path <ProfileDir>/chrome/userContent.css */
/**/
/* For chromium see: https://superuser.com/questions/52967/change-default-css-of-google-chrome */
/* Could use https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo?hl=en */
/* On firefox, could use greasmonkey */
/* See https://superuser.com/questions/94824/how-to-get-firefox-greasemonkey-script-to-use-a-local-cascading-stylesheet */
/* For how greasemonkey sheet can be loaded*/
@-moz-document domain(teams.microsoft.com) {
body{
font-size: 1.9rem !important;
line-height: 1.26 !important;
/* This emulates browser zoom*/
transform-origin: left top !important;
transform: scale(0.67) !important;
/* To fill the page need to expand the width and height of the body*/
width: calc(100vw/0.67) !important;
height: calc(100vh/0.67) !important;
}
/* stylesheets.theme-default.min-816b8182.css | https://statics.teams.microsoft.com/hashedcss/stylesheets.theme-default.min-816b8182.css */
thread .ts-message .media-left {
align-self: flex-start !important;
}
.thread-body > .media-left {
margin-top: -2rem !important;
}
.message-body-container {
/* margin-bottom: .6rem !important; */
margin-bottom: .1rem !important;
}
.ts-message-thread-body .message-body {
/* padding: .8rem 0 .2rem !important; */
padding: 0.1rem 0 0.1rem !important;
}
.chat-style thread .ts-message.conversation-bubble {
/* padding-top: .2rem !important; */
padding-top: 0.1rem !important;
}
.ts-middle {
/* background: !important; */
/* background: #f3f2f1 !important; */
}
.ts-middle-messages-body, .ts-middle-messages-container {
/* background: #f3f2f1 !important; */
background: #fcfcfc !important;
}
virtual-repeat > .list-wrap.list-wrap-v3 > .item-wrap {
/* background: #f3f2f1 !important; */
background: #fcfcfc !important;
}
.message-list-divider-text {
/* background: #f3f2f1 !important; */
background: #fcfcfc !important;
}
.ts-embedded-container {
/* background: #f3f2f1 !important; */
background: #fcfcfc !important;
}
.chat-style .self .message-actions-container, .chat-style .self .message-body {
/* background: #e5e5f1 !important; */
background: #f2f2fA !important;
}
.ts-message-thread-body .message-body .message-actions {
/* top: -.3rem !important; */
top: -1rem !important;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.