stefanbc/arca

View on GitHub
lib/styles/_media.scss

Summary

Maintainability
Test Coverage
/* Landscape phones and down */
@media (max-width: 480px) { 
    .main-container {
        .layout {
            max-width: 320px;
            padding: 40px 20px 25px;
            .input-wrapper {
                &:first-child {
                    margin-bottom: 0;
                }
            }
            #calculator-wrapper {
                #aspect-ratio-buttons-wrapper {
                    .aspect-ratio-button {
                        margin-bottom: 10px;
                    }
                }
                #values-wrapper {
                    margin: 0;
                    padding: 0;
                    #original-values {
                        margin-bottom: 15px;
                        &:after {
                            display: none;
                        }
                        .input-wrapper {
                            margin-right: 0;
                        }
                    }
                    #new-values {
                        margin-bottom: 15px;
                        .input-wrapper {
                            margin-left: 0;
                        }
                    }
                }
                #reset-button {
                    border: 2px solid $color_2;
                    border-radius: 4px;
                    margin-top: 10px;
                }
            }
            footer {
                margin-top: 0;
            }
        }
    }
}