// http://ionicframework.com/docs/v2/theming/ // App Global Sass // -------------------------------------------------- // Put style rules here that you want to apply globally. These // styles are for the entire app and not just one component. // Additionally, this file can be also used as an entry point // to import other Sass files to be included in the output CSS. body { user-select: text; } a { cursor: pointer; } .ellipsis { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .item-hash { @extend .ellipsis; opacity: 0.7; } .list--summary { ion-label { color: #334; font-weight: bold; } ion-item { color: #99a; font-size: 1.125rem; padding: 0; } ion-note { color: #99a; max-width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } .grid--table { margin: 10px 0 20px; .col { padding: 1em 0.4em; } ion-row { font-size: 16px; &:first-child { border-top: none; } &:nth-child(even) { background-color: #f8f9fd; } &:last-child { background-color: #fff; } } } .grid--table.grid { .row { //transition: transform 200ms ease, box-shadow 200ms ease; //font-size: 16px; } //&:hover { // cursor: pointer; // transform: scale(1.02); // background-color: #ffffff; // box-shadow: 0 5px 20px -5px rgba(0, 0, 0, 0.08); //} } ion-infinite-scroll{ width: 100%; } // Shared Sass variables, which can be used to adjust Ionic's // default Sass variables, belong in "theme/variables.scss". // // To declare rules for a specific mode, create a child rule // for the .md, .ios, or .wp mode classes. The mode class is // automatically applied to the element in the app. // Desktop ion-navbar { width: 100%; height: 100%; color: #1d326a; background-image: linear-gradient(to right, #081124, #0b1a35, #0f2246, #152a58, #1d326a); } ion-header .toolbar { margin: auto; } ion-footer .toolbar[fixed] { min-height: 36px; } @media (min-width: map-get($grid-breakpoints, lg)) { ion-navbar.toolbar, ion-header .toolbar[fixed], ion-footer .toolbar[fixed], ion-tabs .tabbar { margin: 0; padding-right: calc((100% - #{map-get($grid-max-widths, lg)}) / 4); padding-left: calc((100% - #{map-get($grid-max-widths, lg)}) / 4); } } a.disabled-link{ color: #99a; pointer-events: none; } .no-txs { background-color: #fcf8e3; border: 1px solid #faebcc; color: #8a6d3b; border-radius: 3px; margin: 5px; padding: 5px; } .pill { background: #f7f8fc; color: #1C1E1A; border-radius: 5px; padding: 4px; text-transform: capitalize; } .content-container { background: #f7f8fc !important; //override base ionic color } .page-content-grid { display: flex; flex: 1; padding-right: calc((100% - #{map-get($grid-max-widths, lg)}) / 4); padding-left: calc((100% - #{map-get($grid-max-widths, lg)}) / 4); margin-bottom: 36px; margin-top: 30px; ion-col.page-content{ margin-top: 0; margin-bottom: 0; } } .content-container{ &--heading{ padding: 0; margin-top: 10rem; &.all-coins{ text-align: center; } } } @media (min-width: map-get($grid-breakpoints, lg)) { .page-content-grid { margin-top: 0px; } } @media (max-width: map-get($grid-breakpoints, lg)) { .content-container{ &--heading.all-coins{ margin-top: 15rem; } } } @media (max-width: map-get($grid-breakpoints, md)) { .content-container{ &--heading.all-coins{ margin-top: 15rem; } } }