Bitbucket Ocean Dark (Base16) Theme

bitbucket-syntax-highlighting.css

:root {
  /*
    Swap any Base16 theme here
    http://terminal.sexy
	  Defaults to Ocean Dark Extended
  */
  --bg: #2b303b;
  --fg: #c0c5ce;
  --c0: #2b303b;
  /* C1 & C2 (diff highlights) might need manual darken override */
  --c1: #443E47;
  --c2: #49534E;
  --c3: #ebcb8b;
  --c4: #8fa1b3;
  --c5: #b48ead;
  --c6: #96b5b4;
  --c7: #c0c5ce;
  --c8: #65737e;
  --c9: #bf616a;
  --c10: #a3be8c;
  --c11: #d08770;
  --c12: #8fa1b3;
  --c13: #b48ead;
  --c14: #96b5b4;
  --c15: #eff1f5;
}

/*Syntax Highlighting*/
.source {
  /* Catch-all "other" text color */
  color: var(--c15) !important;
}

code,
.common {
  background-color: var(--bg) !important;
}

.ProseMirror .code-block .code-content {
  background-color: var(--bg) !important;
  color: var(--fg) !important;
}

/* Git Additions */
.refract-container .addition pre.source {
  background-color: var(--c2) !important;
}

/* Git Deletions */
.refract-container .deletion pre.source {
  background-color: var(--c1) !important;
}

/* Deleted diff highlight */
ins,
del {
  /* TODO: Using a single color for better readability */
  background-color: var(--c8) !important;
  /* background-color:var(--c10) !important; */
  /* background-color:var(--c9) !important; */
  /* color: var(--c15) !important; */
}

/* CSS media queries */
.atrule {
  color: var(--c13) !important;
}

.comment {
  color: var(--c8) !important;
}

.constant {
  color: var(--c9) !important;
}

.function {
  color: var(--c4) !important;
}

.keyword {
  color: var(--c13) !important;
}

.boolean {
  color: var(--c11) !important;
}

.number {
  color: var(--c11) !important;
}

.punctuation {
  color: var(--fg) !important;
}

.property {
  color: var(--c4) !important;
}

/* CSS selectors */
.selector {
  color: var(--c11) !important;
}

.string {
  color: var(--c10) !important;
}

/* HTML attributes */
.token.attr-name {
  color: var(--c11) !important;
}

.token.attr-value {
  color: var(--c10) !important;
}

.token.important {
  color: var(--c4) !important;
}

/* HTML Tag */
.token.tag {
  color: var(--c9) !important;
}


/*********************/
/* Stylistic changes */
/*********************/
/* Move git +/- diff tokens out of line and over gutter */
.addition>.source:before,
.deletion>.source:before {
  color: var(--fg) !important;
  position: relative;
  right: 11px;
}

/* Hide left navigation bar */
body.adg3 {
  background: var(--bg);
}

/* ( This is hard to read after changing body background) */
.pull-request-title {
  color: var(--c15) !important;
}

#adg3-navigation {
  opacity: 0.1;
}

#adg3-navigation:hover {
  opacity: 1;
}

/* Need wildcards since class names are generated by CSS in JS */
[class*="ContainerNavigationInner"] {
  background-color: unset !important;
}

[class*="NavigationContainerNavigationWrapper"] a {
  background-color: unset !important;
}

[class*="NavigationContainerNavigationWrapper"] button {
  background-color: unset !important;
}



/* Literally-white space in-between files in PR */
#repo-content {
  padding: 0 0 0 15px;
}

.bb-udiff+.bb-udiff {
  margin-top: 0 !important;
}

/* Hide ugly code container */
/* .bb-udiff .heading { */
.heading,
.diff-container {
  background-color: var(--bg) !important;
}

h1.filename,
.aui-button {
  color: var(--c8) !important;
}

.line-numbers {
  position: relative;
  left: -8px;
}

.refract-container .line-numbers::after,
.refract-container .line-numbers::before {
  color: var(--c8) !important;
}

.refract-container .line-numbers-skipped {
  background-color: unset !important;
}

.skipped-container .ellipsis {
  background: var(--bg);
}

.gutter {
  background-color: unset !important;
}

minified

:root{--bg:#2b303b;--fg:#c0c5ce;--c0:#2b303b;--c1:#443E47;--c2:#49534E;--c3:#ebcb8b;--c4:#8fa1b3;--c5:#b48ead;--c6:#96b5b4;--c7:#c0c5ce;--c8:#65737e;--c9:#bf616a;--c10:#a3be8c;--c11:#d08770;--c12:#8fa1b3;--c13:#b48ead;--c14:#96b5b4;--c15:#eff1f5}.source{color:var(--c15)!important}.common,code{background-color:var(--bg)!important}.refract-container .addition pre.source{background-color:var(--c2)!important}.refract-container .deletion pre.source{background-color:var(--c1)!important}del,ins{background-color:var(--c8)!important}.atrule{color:var(--c13)!important}.comment{color:var(--c8)!important}.constant{color:var(--c9)!important}.function{color:var(--c4)!important}.keyword{color:var(--c13)!important}.boolean{color:var(--c11)!important}.number{color:var(--c11)!important}.punctuation{color:var(--fg)!important}.property{color:var(--c4)!important}.selector{color:var(--c11)!important}.string{color:var(--c10)!important}.token.attr-name{color:var(--c11)!important}.token.attr-value{color:var(--c10)!important}.token.important{color:var(--c4)!important}.token.tag{color:var(--c9)!important}.addition>.source:before,.deletion>.source:before{color:var(--fg)!important;position:relative;right:11px}body.adg3{background:var(--bg)}.pull-request-title{color:var(--c15)!important}#adg3-navigation{opacity:.1}#adg3-navigation:hover{opacity:1}[class*=ContainerNavigationInner]{background-color:unset!important}[class*=NavigationContainerNavigationWrapper] a{background-color:unset!important}[class*=NavigationContainerNavigationWrapper] button{background-color:unset!important}#repo-content{padding:0 0 0 15px}.bb-udiff+.bb-udiff{margin-top:0!important}.diff-container,.heading{background-color:var(--bg)!important}.aui-button,h1.filename{color:var(--c8)!important}.line-numbers{position:relative;left:-8px}.refract-container .line-numbers::after,.refract-container .line-numbers::before{color:var(--c8)!important}.refract-container .line-numbers-skipped{background-color:unset!important}.skipped-container .ellipsis{background:var(--bg)}.gutter{background-color:unset!important}