tasks.scss

@use 'styles/settings' as s;
@use 'styles/mixins' as mx;
@use 'styles/functions' as fn;

.tasks-page {
    h2 {
        margin-top: 40px;
    }

    .intro-section {
        font-size: fn.toRem(18);

        @include mx.breakpoint(large) {
            font-size: fn.toRem(24);
        }
    }

    .tasks-container {
        margin-top: 20px;
        margin-bottom: 60px;

        .task {
            margin-bottom: 30px;
        }
    }
    
    .task-error {
        margin-top: 20px;
        border-radius: 5px;
        padding: 20px;
        background: s.$background-white;
    }
}