1. Приветствуем Вас на неофициальном форуме технической поддержки XenForo на русском языке. XenForo - коммерческий форумный движок от бывших создателей vBulletin, написанный на PHP.

Ширина спойлера

Тема в разделе "Для новичков", создана пользователем Avenax, 16.04.2018 в 07:11.

Загрузка
  1. Avenax

    Avenax Новичок

    Регистрация:
    14.04.18
    Сообщения:
    4
    Симпатии:
    0
    Версия XF:
    1.5.10
    Ребят помогите пожалуйста, как сделать ширину спойлера по ширине шаблона

    Код:
    /* .bbCodeX classes are designed to exist inside .baseHtml. ie: they have no CSS reset applied */
    
    .bbCodeBlock
    {
        @property "bbCodeBlock";
        background-color: rgb(37, 37, 37);
        padding: 5px;
        margin: 1em @messageInfo.margin-left 1em 0;
        border: 1px solid rgb(26, 26, 26);
        border-radius: 4px;
        overflow: auto;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.10);
        @property "/bbCodeBlock";
    }
    
        .bbCodeBlock .bbCodeBlock,
        .hasJs .bbCodeBlock .bbCodeSpoilerText,
        .messageList.withSidebar .bbCodeBlock
        {
            margin-right: 0;
        }
    
        /* mini CSS reset */
        .bbCodeBlock pre,
        .bbCodeBlock blockquote
        {
            margin: 0;
        }
       
        .bbCodeBlock img
        {
            border: none;
        }
    
    .bbCodeBlock .type
    {
        @property "bbCodeBlockType";
        font-size: 11px;
        font-family: @body.font-family;
        color: rgb(255, 255, 255);
        background-color: rgb(45, 45, 45);
        padding: 8px;
        margin-bottom: 5px;
        border: 1px solid rgb(26, 26, 26);
        border-radius: 4px;
        @property "/bbCodeBlockType";
    }
    
    .bbCodeBlock pre,
    .bbCodeBlock .code
    {
        @property "bbCodeCode";
        font-size: 10pt;
        font-family: Consolas, 'Courier New', Courier, monospace;
        background-color: rgb(55, 55, 55);
        padding: 10px;
        border: 1px solid rgb(26, 26, 26);
        border-radius: 4px;
        word-wrap: normal;
        overflow: auto;
        line-height: 1.24;
        min-height: 30px;
        max-height: 500px;
        _width: 600px;
        direction: ltr;
        @property "/bbCodeCode";
    }
    
    .bbCodeBlock .code
    {
        white-space: nowrap;
    }
    
    .bbCodeQuote
    {
        @property "bbCodeQuote";
        border: 1px solid rgb(26, 26, 26);
        border-radius: 4px;
        overflow: auto;
        @property "/bbCodeQuote";
    }
    
    .bbCodeQuote .attribution
    {
        @property "bbCodeQuoteAttribution";
        color: rgb(255, 255, 255);
        background-color: @GameZone_Background;
        @property "/bbCodeQuoteAttribution";
    }
    
    .bbCodeQuote .quoteContainer
    {
        overflow: hidden;
        position: relative;
       
        @property "bbCodeQuoteMessage";
        font-style: italic;
        font-size: 9pt;
        background-color: rgb(55, 55, 55);
        padding: 10px;
        border: 1px solid rgb(26, 26, 26);
        border-radius: 4px;
        @property "/bbCodeQuoteMessage";
    }
    
    <xen:if is="@bbCodeQuoteMaxHeight">
        .bbCodeQuote .quoteContainer .quote
        {
            max-height: @bbCodeQuoteMaxHeight;
            overflow: hidden;
            padding-bottom: 1px;
        }
       
            .NoJs .bbCodeQuote .quoteContainer .quote
            {
                max-height: none;
            }
    
        .bbCodeQuote .quoteContainer .quoteExpand
        {       
            display: none;
            box-sizing: border-box;
            position: absolute;
            height: 80px;
            top: {xen:calc '@bbCodeQuoteMaxHeight + intval(@bbCodeQuoteMessage.padding-top) + intval(@bbCodeQuoteMessage.padding-bottom) - 80'}px;
            left: 0;
            right: 0;
           
            font-size: 11px;
            line-height: 1;
            text-align: center;
            color: @secondaryLight;
            cursor: pointer;
            padding-top: 65px;
            background: -webkit-linear-gradient(top, {xen:helper rgba, @bbCodeQuoteMessage.background-color, 0} 0%, {xen:helper unrgba, @bbCodeQuoteMessage.background-color} 80%);
            background: -moz-linear-gradient(top, {xen:helper rgba, @bbCodeQuoteMessage.background-color, 0} 0%, {xen:helper unrgba, @bbCodeQuoteMessage.background-color} 80%);
            background: -o-linear-gradient(top, {xen:helper rgba, @bbCodeQuoteMessage.background-color, 0} 0%, {xen:helper unrgba, @bbCodeQuoteMessage.background-color} 80%);
            background: linear-gradient(to bottom, {xen:helper rgba, @bbCodeQuoteMessage.background-color, 0} 0%, {xen:helper unrgba, @bbCodeQuoteMessage.background-color} 80%);
           
            border-bottom-left-radius: @bbCodeQuoteMessage.border-bottom-left-radius;
            border-bottom-right-radius: @bbCodeQuoteMessage.border-bottom-right-radius;
        }
       
        .bbCodeQuote .quoteContainer .quoteExpand.quoteCut
        {
            display: block;
        }
       
        .bbCodeQuote .quoteContainer.expanded .quote
        {
            max-height: none;
        }
       
        .bbCodeQuote .quoteContainer.expanded .quoteExpand
        {
            display: none;
        }
    <xen:else />
        .bbCodeQuote .quoteContainer .quoteExpand
        {
            display: none;
        }
    </xen:if>
    
        .bbCodeQuote img
        {
            max-height: 150px;
        }
       
        .bbCodeQuote iframe,
        .bbCodeQuote .fb_iframe_widget,
        .bbCodeQuote object,
        .bbCodeQuote embed
        {
            max-width: 200px;
            max-height: 150px;
        }
       
        .bbCodeQuote iframe:-webkit-full-screen
        {
            max-width: none;
            max-height: none;
        }
       
        .bbCodeQuote iframe:-moz-full-screen
        {
            max-width: none;
            max-height: none;
        }
       
        .bbCodeQuote iframe:-ms-fullscreen
        {
            max-width: none;
            max-height: none;
        }
       
        .bbCodeQuote iframe:fullscreen
        {
            max-width: none;
            max-height: none;
        }
       
    .bbCodeSpoilerButton
    {
        margin: 5px 0;
        max-width: 99%;
    }
    
        .bbCodeSpoilerButton > span
        {
            display: inline-block;
            max-width: 1000%;
            height: auto;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
        }
       
    .hasJs .bbCodeSpoilerText
    {
        display: none;
        @property "bbCodeSpoilerText";
        background-color: rgb(55, 55, 55);
        padding: 10px;
        margin-top: 5px;
        margin-right: @messageInfo.margin-left;
        margin-bottom: 5px;
        border: 1px solid rgb(37, 37, 37);
        border-radius: 4px;
        overflow: auto;
        @property "/bbCodeSpoilerText";
    }
    
        .hasJs .bbCodeSpoilerText .bbCodeSpoilerText,
        .hasJs .bbCodeSpoilerText .bbCodeBlock,
        .hasJs .messageList.withSidebar .bbCodeSpoilerText
        {
            margin-right: 0;
        }
       
    .NoJs .bbCodeSpoilerContainer
    {
        background-color: @contentText; /* fallback for browsers without currentColor */
        background-color: currentColor;
    }
    
        .NoJs .bbCodeSpoilerContainer > .bbCodeSpoilerText
        {
            visibility: hidden;
        }
    
        .NoJs .bbCodeSpoilerContainer:hover
        {
            background-color: transparent;
        }
       
            .NoJs .bbCodeSpoilerContainer:hover > .bbCodeSpoilerText
            {
                visibility: visible;
            }
    
    <xen:if is="@enableResponsive">
    @media (max-width:@maxResponsiveWideWidth)
    {
        .Responsive .bbCodeBlock,
        .Responsive.hasJs .bbCodeSpoilerText
        {
            margin-right: 0;
        }
    }
    </xen:if>
    
    а то на данный момент так

    https://pp.userapi.com/c847121/v847121767/26c23/25pOlkc0lgU.jpg
     
    Последнее редактирование: 16.04.2018 в 07:51

Поделиться этой страницей