BangleApps/css/main.css

.navbar { background-color: #5755d9; padding: 1em 1em 1em 1em; }
.navbar .navbar-brand {
  color: #fff;
  font-weight: bold;
}

.container.apploader-tab, ul.tab.tab-block {
  padding-left: 1rem;
  padding-right: 1rem;
  border-bottom: 0px;
}

.navbar-brand.mr-2 > img {
  margin-left: 0.3rem;
}

.panel-body.columns {
  margin: 1px;
}

.tile.column.col-6.col-sm-12.col-xs-12.app-tile {
  border: solid 1px #fafafa;
  margin: 0;
  min-height: 150px;
  padding-top: 0.5rem;
}

.tab.tab-block .tab-item  {
  border-bottom: solid 1px #dadee4;
}

a.mr-2{
  display: flex; 
  align-items: center;
}

.navbar-section > a > div {
   margin-left: 0.75rem;
}

.dropdown-container {
  margin-bottom: 0.5rem;
  margin-top: 0.5rem;
}

a.btn.btn-link.dropdown-toggle {
  padding-left: 0.01em;
}

.avatar img {
  border-radius: 5px 5px 5px 5px;
  background: #fff;
}
#toastcontainer {
  position:fixed;
  bottom:8px;left:0px;right:0px;
  z-index: 100;
}
.hero {
  padding-bottom: 1rem;
  padding-top: 1rem;
  text-align:center;
}
.chip {
  cursor: pointer;
}
.filter-nav {
  display: inline-block;
}
.device-nav {
  display: inline-block;
}
.sort-nav {
  float: right;
}

.app-tile {
  position: relative;
  border-bottom: 1px solid #EEE;
  margin-bottom: 4px;
  min-height: 8em;
}

.tile-content { position: relative; }
.link-github {
  position:absolute;
  top: 36px;
  left: -24px;
}
.tile-screenshot {
  position:absolute;bottom:1em;right:1em;
  width:4em;height:4em;
  padding:2px;border:1px solid black;
  cursor:pointer;
}

.btn.btn-favourite { color: red; }
.btn.btn-favourite:hover { color: red; }

.icon.icon-emulator { text-indent: 0px; } /*override spectre*/
.icon.icon-emulator {
  content: url("data:image/svg+xml,%3Csvg fill='rgb(87, 85, 217)' xmlns='http://www.w3.org/2000/svg' viewBox='4 4 40 40' width='1em' height='1em'%3E%3Cpath d='M 8.5 5 C 6.0324991 5 4 7.0324991 4 9.5 L 4 30.5 C 4 32.967501 6.0324991 35 8.5 35 L 17 35 L 17 40 L 13.5 40 A 1.50015 1.50015 0 1 0 13.5 43 L 18.253906 43 A 1.50015 1.50015 0 0 0 18.740234 43 L 29.253906 43 A 1.50015 1.50015 0 0 0 29.740234 43 L 34.5 43 A 1.50015 1.50015 0 1 0 34.5 40 L 31 40 L 31 35 L 39.5 35 C 41.967501 35 44 32.967501 44 30.5 L 44 9.5 C 44 7.0324991 41.967501 5 39.5 5 L 8.5 5 z M 8.5 8 L 39.5 8 C 40.346499 8 41 8.6535009 41 9.5 L 41 30.5 C 41 31.346499 40.346499 32 39.5 32 L 29.746094 32 A 1.50015 1.50015 0 0 0 29.259766 32 L 18.746094 32 A 1.50015 1.50015 0 0 0 18.259766 32 L 8.5 32 C 7.6535009 32 7 31.346499 7 30.5 L 7 9.5 C 7 8.6535009 7.6535009 8 8.5 8 z M 17.5 12 C 16.136406 12 15 13.136406 15 14.5 L 15 25.5 C 15 26.863594 16.136406 28 17.5 28 L 30.5 28 C 31.863594 28 33 26.863594 33 25.5 L 33 14.5 C 33 13.136406 31.863594 12 30.5 12 L 17.5 12 z M 18 18 L 30 18 L 30 25 L 18 25 L 18 18 z M 20 35 L 28 35 L 28 40 L 20 40 L 20 35 z'/%3E%3C/svg%3E");
}
.icon.icon-favourite { text-indent: 0px; } /*override spectre*/
.icon.icon-favourite::before {
  content: "\02661"; /* 0x2661 = empty heart; 0x2606 = empty star */
}
.icon.icon-favourite-active::before {
  content: "\02665"; /* 0x2665 = solid heart; 0x2605 = solid star  */
}
.icon.icon-interface {text-indent: 0px;} /*override spectre*/
.icon.icon-interface::before {
  position: absolute; left: 50%; top: 70%;
  transform: translate(-50%,-50%);
  content: url("data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg fill='rgb(87, 85, 217)' xmlns='http://www.w3.org/2000/svg' viewBox='2 2 28 28' width='1.5em' height='1.5em'%3E%3Cpath d='M 6 4 C 4.895 4 4 4.895 4 6 L 4 24 C 4 25.105 4.895 26 6 26 L 24 26 C 25.105 26 26 25.105 26 24 L 26 8 L 22 4 L 20 4 L 20 10 C 20 10.552 19.552 11 19 11 L 10 11 C 9.448 11 9 10.552 9 10 L 9 4 L 6 4 z M 16 4 L 16 9 L 18 9 L 18 4 L 16 4 z M 10 16 L 20 16 C 21.105 16 22 16.895 22 18 L 22 24 L 8 24 L 8 18 C 8 16.895 8.895 16 10 16 z'/%3E%3C/svg%3E");
}