William O'Beirne de7d4fbaa2 v3 Style Import (#151)
* Convert bootstrap to sass instead of checked in and less

* Darken body, adjust header.

* First pass at tab styles, each tab will need a lot of individual love tho.

* Update footer to main site content, improve responsiveness.

* Missing key added.

* Fix dropdowns.

* Convert GenerateWallet HTML over, still needs styling.

* Send form.

* Current rates styled.

* CurrencySwap form styles.

* SwapInfoHeader styled.

* Finish up swap restyling, minor usability improvements for mobile.

* Fix up notifications / alert customizations

* Import v3 variables.

* Fix notification spacing.

* Align input height base with buttons.

* Revert height base, add additional bootstrap overrides.

* Grid overrides.

* Move overrides to their own folder. Adjust naming.

* Fix inconsistencies.

* Style generate wallet pt 1.

* Style generate wallet pt 2

* Style generate wallet pt 3

* Fix swap

* Added some missing overries, fixed the fallout.

* Remove header text, indicate alpha version.

* Fix radio / checkbox weights.

* Bind => arrow

* Convert simpledropdown to proper form select, instead of weirdly implemented nonfuncitoning dropdown.

* Fix token balances buttons, footr icons.
2017-09-05 14:52:01 -05:00

44 lines
962 B
SCSS

// Extends Bootstrap's `.alert`
@import "common/sass/variables";
@import "common/sass/mixins";
@import "~bootstrap-sass/assets/stylesheets/bootstrap/alerts";
// Alert icons
.alert:after {
content: '';
background-position: 50%;
background-repeat: no-repeat;
background-size: contain;
display: block;
color: #fff;
position: absolute;
top: 0;
bottom: 0;
left: 1%;
width: $space * 2;
@media screen and (max-width: $screen-sm) {
left: 3%;
}
@media screen and (max-width: $screen-xs) {
left: 1%;
}
}
.alert,
.alert-info {
@include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text);
}
.alert-success {
@include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text);
}
.alert-warning {
@include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text);
}
.alert-danger {
@include alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text);
}