Помогите, редактировать плагин, CSS

qlzpam

Проверенные
Сообщения
10
Реакции
3
Баллы
60
Приветствую, как уменьшить расстояние между полосками??
Помогите пожалуйста



1670455858665.png

Код:
.bg-linear-gradient (@color-one, @color-two: transparent) {
    background-size: 30px 30px;
    animation: bg-animate 0s linear infinite;
}

.svg-notice {
    position: relative;
    .svg-notice-grid {
        width: @xf-svg_admin_notice_width;
        min-height: 50px;
        margin: 10px auto;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 11px;
        .svg-notice-item {
            text-align: justify;
            padding: 2px;
            &:nth-of-type(1) {
                flex-basis: 1%;
                color: @xf-svg_admin_notice_icon_color;
                align-self: flex-start;
                font-size: 1.2em;
            }
            &:nth-of-type(2) {
                flex-basis: 99%;
                color: @xf-svg_admin_notice_text_color;
                padding-left: 0;
                line-height: 1.3;
                a {
                    color: @xf-svg_admin_notice_link_color;
                    font-weight: 500;
                }
            }                    
        }
        .svg-notice-hint {
            display: block;
            font-size: 1.5em;
            font-weight: 500;
            text-transform: uppercase;
            text-shadow: -0   -1px 3px #FFFFE0,
                          0   -1px 3px #FFFFE0,
                         -0    1px 3px #FFFFE0,
                          0    1px 3px #FFFFE0,
                         -1px -0   3px #FFFFE0,
                          1px -0   3px #FFFFE0,
                         -1px  0   3px #FFFFE0,
                          1px  0   3px #FFFFE0,
                         -1px -1px 3px #FFFFE0,
                          1px -1px 3px #FFFFE0,
                         -1px  1px 3px #FFFFE0,
                          1px  1px 3px #FFFFE0,
                         -1px -1px 3px #FFFFE0,
                          1px -1px 3px #FFFFE0,
                         -1px  1px 3px #FFFFE0,
                          1px  1px 3px #FFFFE0;
            position: absolute;
            bottom: -0.6em;
            left: 2em;
        }    
        &.grid-important {
            background-color: fade(@xf-svg_color_important, 80%);
            .bg-linear-gradient {{ property('svg_admin_notice_disable_strips') ? '(transparent)' : '(fade(@xf-svg_color_important, 20%))' }};
            border-left: 5px solid xf-intensify(@xf-svg_color_important, 10%);
            .svg-notice-hint {
                color: @xf-svg_color_important;
            }
            .svg-notice-item {
                &:nth-of-type(1) {
                    color: {{ property('svg_admin_notice_icon_color_default') ? 'xf-intensify(@xf-svg_color_important, 15%)' : '@xf-svg_admin_notice_icon_color' }};
                }
            }        
        }
        &.grid-info {
            background-color: fade(@xf-svg_color_info, 80%);
            .bg-linear-gradient {{ property('svg_admin_notice_disable_strips') ? '(transparent)' : '(fade(@xf-svg_color_info, 20%))' }};
            border-left: 5px solid xf-intensify(@xf-svg_color_info, 10%);
            .svg-notice-hint {
                color: @xf-svg_color_info;
            }
            .svg-notice-item {
                &:nth-of-type(1) {
                    color: {{ property('svg_admin_notice_icon_color_default') ? 'xf-intensify(@xf-svg_color_info, 15%)' : '@xf-svg_admin_notice_icon_color' }};
                }
            }
        }
        &.grid-success {
            background-color: fade(@xf-svg_color_success, 80%);
            .bg-linear-gradient {{ property('svg_admin_notice_disable_strips') ? '(transparent)' : '(fade(@xf-svg_color_success, 20%))' }};
            border-left: 5px solid xf-intensify(@xf-svg_color_success, 10%);
            .svg-notice-hint {
                color: @xf-svg_color_success;
            }
            .svg-notice-item {
                &:nth-of-type(1) {
                    color: {{ property('svg_admin_notice_icon_color_default') ? 'xf-intensify(@xf-svg_color_success, 15%)' : '@xf-svg_admin_notice_icon_color' }};
                }
            }        
        }
        &.grid-warning {
            background-color: fade(@xf-svg_color_warning, 80%);
            .bg-linear-gradient {{ property('svg_admin_notice_disable_strips') ? '(transparent)' : '(fade(@xf-svg_color_warning, 20%))' }};
            border-left: 5px solid xf-intensify(@xf-svg_color_warning, 10%);
            .svg-notice-hint {
                color: @xf-svg_color_warning;
            }
            .svg-notice-item {
                &:nth-of-type(1) {
                    color: {{ property('svg_admin_notice_icon_color_default') ? 'xf-intensify(@xf-svg_color_warning, 15%)' : '@xf-svg_admin_notice_icon_color' }};
                }
            }        
        }    
    }
}

@keyframes bg-animate {
    from {
        background-position: 0 0;
    }
    to {
       background-position: -60px 0;
    }
}

.svg-notice-btn (@custom_btn, @color_btn) {
    [data-cmd="xfCustom_@{custom_btn}"] {
        color: @color_btn !important;
    }
}

.svg-notice-btn (svginfo, @xf-svg_color_info);
.svg-notice-btn (svgimportant, @xf-svg_color_important);
.svg-notice-btn (svgsuccess, @xf-svg_color_success);
.svg-notice-btn (svgwarning, @xf-svg_color_warning);

[data-cmd="svg_notice"] {
    color: red !important;
    &:after {
        border-top: 4px solid red !important;
    }
}
 

Вложения

  • 1670450054900.png
    1670450054900.png
    16.6 KB · Просмотры: 17
Последнее редактирование:
Вопросы связанные с конкретными плагинами принято задавать в тему плагина
 
Современный облачный хостинг провайдер | Aéza
Назад
Сверху Снизу