dbmedialab/reader-critics

View on GitHub
src/front/scss/pages/suggestion/_suggestion.scss

Summary

Maintainability
Test Coverage
.confirmation {
    .container {
        padding: 0;
    }

    form {
        input,
        textarea,
        button {
            width: 100%;
        }

        input {
            font-size: 14px;
        }

        textarea {
            max-width: 100%;
        }

        .hide {
            display: none;
            visibility: hidden;
        }
    }

    ul {
        li {
            color: #F00;
        }
    }

    small {
        &.error {
            color: #D60000;
        }
    }

    .feedback-form {
        width: 100%;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;

        textarea {
            resize: none;
            height: 200px;
        }
    }

    .return-to-article {
        h5 {
            a {
                button {
                    font-size: 20px;
                }
            }
        }
    }
}

.notifications {
    display: none;
    box-sizing: border-box;
    position: fixed;
    top: 0;
    right: auto;
    left: auto;
    z-index: 9999;
    margin: 0;
    width: 100%;

    .container {
        border: 2px solid #32953C;
        border-top: 0;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
        background: #82D581;
        color: #333;
        font-family: 'Droid Sans', sans-serif;
    }
}

.suggestion {
    .button-primary {
        font-size: 14px;

        &:disabled {
            cursor: not-allowed;
            opacity: .5;
        }
    }

    fieldset {
        p {
            &.thank-message {
                font-family: 'Roboto', sans-serif;
                font-size: 14px;
                color: #888;
            }
        }

        input, textarea {
            margin-bottom: .5rem;
        }
    }
}
@media only screen and (max-width: 480px) {
    .confirmation {
        .feedback-form {
            textarea {
                height: 100px;
            }
        }

        .return-to-article {
            h5 {
                a {
                    button {
                        font-size: 15px;
                }
            }
        }
    }
    }
}