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

1.1.2 Проблема с кнопками после обновления шаблонов

Тема в разделе "Вопросы по стилям, изменения в CSS и шаблонах", создана пользователем Nicolayka, 8 апр 2012.

Загрузка
  1. Nicolayka

    Nicolayka Местный

    Регистрация:
    25.02.12
    Сообщения:
    70
    Симпатии:
    13
    Версия XF:
    1.4.4
    Кнопки изменились...только когда навожу на них курсор, они меняются как и положено. Помогите исправить..
    [​IMG]

    Все кнопки такими стали...не могу найти css стиль...
     
  2. carliker

    carliker Местный

    Регистрация:
    03.10.11
    Сообщения:
    274
    Симпатии:
    114
    Версия XF:
    1.1.1
    Дай ссылку на свой сайт. У меня такая же проблема была, я ее быстро решил. Только вот не помню что делал.
     
  3. Nicolayka

    Nicolayka Местный

    Регистрация:
    25.02.12
    Сообщения:
    70
    Симпатии:
    13
    Версия XF:
    1.4.4
    Он на localhost
     
  4. carliker

    carliker Местный

    Регистрация:
    03.10.11
    Сообщения:
    274
    Симпатии:
    114
    Версия XF:
    1.1.1
    Вот, смотри:
    sshot-1.png

    Если выключить вот эту строку:
    Код:
    background: url("styles/baisik/xenforo/gradients/highlight_faint.png") repeat-x scroll center top #323232;
    То кнопки станут работать также как у тебя.
    Преполагаю, что этой строчки у тебя просто нет.

    Вот в этом шаблоне посмотри
    form.css
    Мой код
    Код:
    /** Forms **/
     
    .xenForm
    {
        margin: 10px auto;
        width: @formWidth;
    }
     
        .xenOverlay .xenForm
        {
            width: @overlayFormWidth;
        }
     
    .xenForm .ctrlUnit dd
    {
        width: {xen:calc '@formWidth - @ctrlUnitLabelWidth'}px;
    }
     
        .xenOverlay .xenForm .ctrlUnit dd
        {
            width: {xen:calc '@overlayFormWidth - @ctrlUnitLabelWidth'}px;
        }
     
    .xenForm .ctrlUnit dd .textCtrl
    {
        width: {xen:calc "@formWidth - @ctrlUnitLabelWidth - @textCtrl.border-left-width - @textCtrl.border-right-width - @textCtrl.padding-left - @textCtrl.padding-right - @ctrlUnitEdgeSpacer"}px;
    }
     
        .xenOverlay .xenForm .ctrlUnit dd .textCtrl
        {
            width: {xen:calc "@overlayFormWidth - @overlayCtrlUnitLabelWidth - @textCtrl.border-left-width - @textCtrl.border-right-width - @textCtrl.padding-left - @textCtrl.padding-right - @ctrlUnitEdgeSpacer"}px;
        }
     
    .xenForm .ctrlUnit dd li > ul .textCtrl
    {
        width: {xen:calc "@formWidth - @ctrlUnitLabelWidth - @textCtrl.border-left-width - @textCtrl.border-right-width - @textCtrl.padding-left - @textCtrl.padding-right - @ctrlUnitEdgeSpacer - @formCtrlIndent"}px;
    }
     
        .xenOverlay .xenForm .ctrlUnit dd li > ul .textCtrl
        {
            width: {xen:calc "@overlayFormWidth - @overlayCtrlUnitLabelWidth - @textCtrl.border-left-width - @textCtrl.border-right-width - @textCtrl.padding-left - @textCtrl.padding-right - @ctrlUnitEdgeSpacer - @formCtrlIndent"}px;
        }
     
    .xenForm .ctrlUnit.fullWidth dd .textCtrl,
    .xenForm .ctrlUnit.fullWidth dd .explain,
    .xenForm .ctrlUnit.fullWidth dd .mceLayout
    {
        margin-left: @ctrlUnitEdgeSpacer;
    }
     
    .xenForm .ctrlUnit.fullWidth dd .textCtrl,
    .xenForm .ctrlUnit.fullWidth dd .mceLayout
    {
        width: {xen:calc "@formWidth - @textCtrl.border-left-width - @textCtrl.border-right-width - @textCtrl.padding-left - @textCtrl.padding-right - 2 * @ctrlUnitEdgeSpacer"}px;
    }
     
        .xenOverlay .xenForm .ctrlUnit.fullWidth dd .textCtrl,
        .xenOverlay .xenForm .ctrlUnit.fullWidth dd .mceLayout
        {
            width: {xen:calc "@overlayFormWidth - @textCtrl.border-left-width - @textCtrl.border-right-width - @textCtrl.padding-left - @textCtrl.padding-right - 2 * @ctrlUnitEdgeSpacer"}px;
        }
     
        .xenForm .ctrlUnit dd > select.textCtrl
        {
            min-width: 150px;
        }
     
        .xenForm .ctrlUnit dd .textCtrl[size],
        .xenForm .ctrlUnit dd .textCtrl.autoSize,
        .xenForm .ctrlUnit.fullWidth dd .textCtrl[size],
        .xenForm .ctrlUnit.fullWidth dd .textCtrl.autoSize,
        .xenOverlay .xenForm .ctrlUnit dd .textCtrl[size],
        .xenOverlay .xenForm .ctrlUnit dd .textCtrl.autoSize,
        .xenOverlay .xenForm .ctrlUnit.fullWidth dd .textCtrl[size],
        .xenOverlay .xenForm .ctrlUnit.fullWidth dd .textCtrl.autoSize
        {
            width: auto !important;
            min-width: 0;
        }
     
        .xenForm .ctrlUnit dd .textCtrl.number
        {
            width: 150px;
        }
     
     
    .xenForm .sectionHeader:first-child
    {
        margin-top: 0;
    }
     
    /** Sections **/
     
    .xenForm fieldset
    {
        border-top: 1px solid @primaryLighterStill;
        margin: 20px auto;
    }
     
    .xenForm > fieldset:first-child
    {
        border-top: none;
        margin: auto;
    }
     
    .xenForm .PreviewContainer + fieldset
    {
        border-top: none;
    }
     
    .xenForm fieldset + .ctrlUnit,
    .xenForm .submitUnit
    {
        border-top: 1px solid @primaryLighterStill;
    }
     
    .xenForm fieldset + .ctrlUnit
    {
        padding-top: 10px;
    }
     
    .xenForm .primaryContent + .submitUnit,
    .xenForm .secondaryContent + .submitUnit
    {
        margin-top: 0;
        border-top: none;
    }
     
    .xenForm .ctrlUnit.submitUnit dd
    {
        /*url('@imagePath/xenforo/gradients/category-23px-light.png') repeat-x top;*/
        /*background: @primaryLightest;
     
        border: 1px solid @primaryLighterStill;
        border-bottom-color: @primaryLighter;
        border-top: none;
        padding-left: 10px;
     
        width: {xen:calc '@formWidth - @ctrlUnitLabelWidth - @ctrlUnitEdgeSpacer - 10 - 2'}px;
     
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;*/
     
        padding-top: 5px;
        padding-bottom: 5px;
    }
     
    /* now undo that */
     
    .xenOverlay .ctrlUnit.submitUnit dd,
    .Menu .ctrlUnit.submitUnit dd,
    #QuickSearch .ctrlUnit.submitUnit dd
    {
        border: none;
        background: none;
    }
     
    .xenForm .ctrlUnit
    {
        @property "ctrlUnit";
     
        @property "/ctrlUnit";
    }
     
        /** Sections Immediately Following Headers **/
     
        .xenForm .sectionHeader + fieldset,
        .xenForm .heading + fieldset,
        .xenForm .subHeading + fieldset
        {
            border-top: none;
            margin-top: 0;
        }
     
     
    /** *********************** **/
    /** TEXT INPUTS            **/
    /** *********************** **/
     
    .textCtrl
    {
        @property "textCtrl";
        font-size: 13px;
        font-family: Calibri, 'Trebuchet MS', Verdana, Geneva, Arial, Helvetica, sans-serif;
        color: @textCtrlText;
        background-color: @textCtrlBackground;
        padding: 3px;
        margin-bottom: 2px;
        border: 1px solid #ccc;
        border-radius: 3px;
        outline: 0;
        @property "/textCtrl";
    }
     
    textarea.textCtrl
    {
        word-wrap: break-word;
    }
     
        .textCtrl:focus,
        .textCtrl.Focus
        {
            @property "textCtrlFocus";
            background-color: @textCtrlBackground;
            border: 1px solid #bbb;
            box-shadow: inset rgba(0,0,0,0.1) 0px 1px 4px;
            @property "/textCtrlFocus";
        }
     
        textarea.textCtrl:focus
        {
            @property "textCtrlTextareaFocus";
     
            @property "/textCtrlTextareaFocus";
        border: 1px solid #bbb;
        box-shadow: inset rgba(0,0,0,0.1) 0px 1px 4px;
        }
     
        input.textCtrl.disabled,
        textarea.textCtrl.disabled,
        .disabled .textCtrl
        {
            @property "textCtrlDisabled";
            font-style: italic;
            color: rgb(100,100,100);
            background-color: rgb(245,245,245);
            @property "/textCtrlDisabled";
        }
     
        .textCtrl.prompt
        {
            @property "formElementPrompt";
            font-style: italic;
            color: rgb(160,160,160);
            @property "/formElementPrompt";
        }
        .textCtrl:-moz-placeholder
        {
            /* needs to be in its own rule due to weird selector */
            @property "formElementPrompt";
            font-style: italic;
            color: rgb(160,160,160);
            @property "/formElementPrompt";
        }
     
        .textCtrl::-webkit-input-placeholder
        {
            /* needs to be in its own rule due to weird selector */
            @property "formElementPrompt";
            font-style: italic;
            color: rgb(160,160,160);
            @property "/formElementPrompt";
        }
     
        .textCtrl.autoSize
        {
            width: auto !important;
        }
     
        .textCtrl.number,
        .textCtrl.number input
        {
            text-align: right;
            width: 150px;
        }
     
        .textCtrl.fillSpace
        {
            width: 100%;
            box-sizing: border-box;
            _width: 95%;
        }
     
        .textCtrl.code,
        .textCtrl.code input
        {
            @property "textCtrlCode";
            font-family: Consolas, "Courier New", Courier, monospace;
            white-space: pre;
            word-wrap: normal;
            direction: ltr;
            @property "/textCtrlCode";
        }
     
        input.textCtrl[type="password"]
        {
            font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
        }
     
        input[type="email"],
        input[type="url"]
        {
            direction: ltr;
        }
     
        .textCtrl.titleCtrl,
        .textCtrl.titleCtrl input
        {
            font-size: 18pt;
        }
     
    textarea.textCtrl.Elastic
    {
        /* use for jQuery.elastic */
        max-height: 300px;
    }
     
    /* for use with wrapped inputs */
    .textCtrlWrap
    {
        display: inline-block;
    }
     
    .textCtrlWrap input.textCtrl
    {
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
    }
     
    /** *********************** **/
    /** BUTTONS                **/
    /** *********************** **/
     
    .button
    {
        font-style: normal;
     
        @property "button";
        font-size: 12px;
        font-family: Calibri, 'Trebuchet MS', Verdana, Geneva, Arial, Helvetica, sans-serif;
        color: #fff;
        background: #323232 url('@imagePath/xenforo/gradients/highlight_faint.png') repeat-x top;
        padding: 0px 6px;
        border: 1px solid #2b2b2b;
        border-radius: 3px;
        text-align: center;
        box-shadow: rgba(0,0,0,0.43) 0px 1px 3px;
        text-shadow: #2b2b2b 0px -1px 0px;
        outline: none;
        line-height: 26px;
        display: inline-block;
        cursor: pointer;
        box-sizing: border-box;
        height: 26px;
        @property "/button";
    }
     
    .button.smallButton
    {
        font-size: 11px;
        padding: 0px 4px;
        line-height: 24px;
        height: 24px;
        border-radius: 3px;
    }
     
    .button.primary
    {
        /*background-color: @primaryLighter;*/
    }
     
    input.button.disabled,
    a.button.disabled,
    input.button.primary.disabled,
    a.button.primary.disabled
    {
        color: #fff;
        text-shadow: none;
        background-color: #c1c1c1;
        border-color: #bbbbbb;
        box-shadow: 0 0 0 transparent;
    }
     
        .button::-moz-focus-inner
        {
            border: none;
        }
     
        a.button
        {
            display: inline-block;
            color: @button.color;
        }
     
        .button:hover,
        .button[href]:hover,
        .buttonProxy:hover .button
        {
            @property "buttonHover";
            color: #fff;
            text-decoration: none;
            background-color: #454545;
            @property "/buttonHover";
        }
     
        .button:focus
        {
            @property "buttonFocus";
            /*border-color: @primaryLight;*/
            @property "/buttonFocus";
        }
     
        .button:active,
        .button.ToggleButton.checked,
        .buttonProxy:active .button
        {
            @property "buttonActive";
            color: #fff;
            background-color: #222;
            outline: 0;
            @property "/buttonActive";
            /*position: relative;
            top: 2px;*/
        }
     
        .button.ToggleButton
        {
            cursor: default;
            width: auto;
            color: @button.border-bottom-color;
        }
     
        .button.ToggleButton.checked
        {
            background-color: #555555;
        }
     
        .button.inputSupplementary
        {
            width: 25px;
            position: absolute;
            top: 0px;
            right: 0px;
        }
     
        .button.inputSupplementary.add
        {
            color: green;
        }
     
        .button.inputSupplementary.delete
        {
            color: red;
        }
     
        .submitUnit .button
        {
            min-width: 100px;
            *min-width: 0;
        }
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
    /** Control Units **/
     
    .xenForm .ctrlUnit
    {
        position: relative;
        margin: 10px auto;
    }
     
    {xen:helper clearfix, '.xenForm .ctrlUnit'}
     
    .xenForm .ctrlUnit.fullWidth
    {
        overflow: visible;
    }
     
    /** Control Unit Labels **/
     
    .xenForm .ctrlUnit dt
    {
        @property "ctrlUnitLabel";
        padding-top: 4px;
        padding-right: 15px;
        text-align: right;
        vertical-align: top;
        @property "/ctrlUnitLabel";
        width: {xen:calc '@ctrlUnitLabelWidth - @ctrlUnitLabel.padding-left - @ctrlUnitLabel.padding-right'}px;
        float: left;
    }
     
    /* special long-text label */
    .xenForm .ctrlUnit dt.explain
    {
        font-size: 11px;
        text-align: justify;
    }
     
        .xenOverlay .xenForm .ctrlUnit dt
        {
            width: {xen:calc '@overlayCtrlUnitLabelWidth - @ctrlUnitLabel.padding-left - @ctrlUnitLabel.padding-right'}px;
        }
     
    .xenForm .ctrlUnit.fullWidth dt,
    .xenForm .ctrlUnit.submitUnit.fullWidth dt
    {
        float: none;
        width: auto;
        text-align: left;
        height: auto;
    }
     
    .xenForm .ctrlUnit.fullWidth dt
    {
        margin-bottom: 2px;
    }
     
        .xenForm .ctrlUnit dt label
        {
            margin-left: @ctrlUnitEdgeSpacer;
        }
     
        /** Hidden Labels **/
     
        .xenForm .ctrlUnit.surplusLabel dt label
        {
            display: none;
        }
     
        /** Section Links **/
     
        .ctrlUnit.sectionLink dt
        {
            text-align: left;
            font-size: 11px;
            padding-top: none;
        }
     
            .ctrlUnit.sectionLink dt a
            {
                margin-left: {xen:calc '10 + 1'}px; /*TODO: sectionHeader padding + border*/
            }   
     
        /** Hints **/
     
        .ctrlUnit dt dfn
        {
            @property "ctrlUnitLabelHint";
            font-style: italic;
            font-size: 10px;
            color: @mutedTextColor;
            margin-left: @ctrlUnitEdgeSpacer;
            display: block;
            @property "/ctrlUnitLabelHint";
        }
     
        .ctrlUnit.fullWidth dt dfn
        {
            display: inline;
            margin: 0;
        }
     
            .ctrlUnit dt dfn b,
            .ctrlUnit dt dfn strong
            {
                color: @dimmedTextColor;
            }
     
        /** Inline Errors **/
     
        .ctrlUnit dt .error
        {
            @property "ctrlUnitLabelError";
            font-size: 10px;
            color: red;
            display: block;
            @property "/ctrlUnitLabelError";
        }
     
        .ctrlUnit dt dfn,
        .ctrlUnit dt .error,
        .ctrlUnit dt a
        {
            font-weight: normal;
        }
     
    .xenForm .ctrlUnit.submitUnit dt
    {
        height: 19px;
        display: block;
    }
     
        .ctrlUnit.submitUnit dt.InProgress
        {
            background: transparent url('@imagePath/xenforo/widgets/ajaxload.info_B4B4DC_facebook.gif') no-repeat center center;
        }
     
    /** Control Holders **/
     
    .xenForm .ctrlUnit dd
    {
        /*todo: kill property */
        @property "ctrlUnitCtrl";
     
        @property "/ctrlUnitCtrl";
        float: left;
    }
     
    .xenForm .ctrlUnit.fullWidth dd
    {
        float: none;
        width: auto;
        padding-left: 0;
    }
     
    /** Explanatory paragraph **/
     
    .ctrlUnit dd .explain
    {
        @property "ctrlUnitCtrlExplain";
        font-size: 11px;
        color: @mutedTextColor;
        margin-top: 2px;
        margin-right: @ctrlUnitEdgeSpacer;
        @property "/ctrlUnitCtrlExplain";
        /*TODO:max-width: auto;*/
    }
     
        .ctrlUnit dd .explain b,
        .ctrlUnit dd .explain strong
        {
            color: @dimmedTextColor;
        }
     
    .ctrlUnit.fullWidth dd .explain
    {
        /*TODO:max-width: auto;*/
    }
     
    /** List items inside controls **/
     
    .ctrlUnit dd li
    {
        margin: 4px 0 8px;
        padding-left: 1px; /* fix a webkit display bug */
    }
     
        .ctrlUnit label.unselectable
        {
            color: @mutedTextColor;
            font-style: italic;
        }
     
    .ctrlUnit dd .break
    {
        margin-bottom: 0.75em;
        padding-bottom: 0.75em;
    }
     
    .ctrlUnit dd .rule
    {
        border-bottom: 1px solid @primaryLighterStill;
    }
     
    .ctrlUnit dd .ddText
    {
        margin-bottom: 2px;
    }
     
    /** Hints underneath checkbox / radio controls **/
     
    .ctrlUnit dd li .hint
    {
        font-size: 11px;
        color: @mutedTextColor;
        margin-left: @formCtrlIndent;
        margin-top: 2px;
    }
     
    /** DISABLERS **/
     
    .ctrlUnit dd li > ul
    {
        margin-left: @formCtrlIndent;
    }
     
    .ctrlUnit dd li > ul > li:first-child
    {
        margin-top: 6px;
    }
     
    /** Other stuff... **/
     
    .ctrlUnit dd .helpLink
    {
        font-size: 10px;
    }
     
    .ctrlUnit.textValue dt
    {
        padding-top: 0px;
    }
     
    /*.xenForm .ctrlUnit dt { background-color: #ffffc6; }
    .xenForm .ctrlUnit dd { background-color: rgb(235,235,255); }
    .xenForm fieldset { background-color: rgb(255,230,180); }*/
     
    .button.spinBoxButton
    {
        font-family: @body.font-family;
        font-size: 11pt;
    }
     
    .unitPairsJustified li
    {
        overflow: hidden;
    }
     
        .unitPairsJustified li .label
        {
            float: left;
        }
     
        .unitPairsJustified li .value
        {
            float: right;
        }
     
    <xen:include template="form_date_picker.css" />
    <xen:include template="form_auto_complete.css" />
     
    /** status editor **/
     
    .statusEditorCounter
    {
        color: green;
    }
     
    .statusEditorCounter.warning
    {
        color: orange;
        font-weight: bold;
    }
     
    .statusEditorCounter.error
    {
        color: red;
        font-weight: bold;
    }
     
    .explain .statusHeader
    {
        display: inline;
    }
     
    .explain .CurrentStatus
    {
        color: @contentText;
        font-style: italic;
        padding-left: 5px;
    }
     
    /* BB code-based editor styling */
     
    .xenForm .ctrlUnit.fullWidth dd .bbCodeEditorContainer
    {
        margin-left: @ctrlUnitEdgeSpacer;
    }
     
    .xenForm .ctrlUnit.fullWidth dd .bbCodeEditorContainer textarea
    {
        margin-left: 0;
        min-height: 200px;
    }
     
    .bbCodeEditorContainer a
    {
        font-size: 11px;
    }
     
    /*
    * Fix silly top padding. This may require additional tags in the padding-top selector.
    */
     
    .xenForm .ctrlUnit > dd
    {
        padding-top: 4px;
    }
     
        .xenForm .ctrlUnit.fullWidth > dd
        {
            padding-top: 0;
        }
     
    .xenForm .ctrlUnit > dd > input,
    .xenForm .ctrlUnit > dd > select,
    .xenForm .ctrlUnit > dd > textarea,
    .xenForm .ctrlUnit > dd > ul
    {
        margin-top: -4px;
    }
     
        .xenForm .ctrlUnit.fullWidth > dd > input,
        .xenForm .ctrlUnit.submitUnit > dd > input,
        .xenForm .ctrlUnit.fullWidth > dd > select,
        .xenForm .ctrlUnit.submitUnit > dd > select,
        .xenForm .ctrlUnit.fullWidth > dd > textarea,
        .xenForm .ctrlUnit.submitUnit > dd > textarea,
        .xenForm .ctrlUnit.fullWidth > dd > ul,
        .xenForm .ctrlUnit.submitUnit > dd > ul
        {
            margin-top: 0;
        }
     
    /*
    * Multi-column checkboxes
    */
     
    .xenForm .checkboxColumns > dd > ul,
    ul.checkboxColumns
    {
        column-count: 2;
        column-gap: 8px;
    }
     
    .xenForm .checkboxColumns.multiple > dd > ul
    {
        column-count: 1;
        column-gap: 0;
    }
     
    .xenForm .checkboxColumns.multiple > dd
    {
        column-count: 2;
        column-gap: 8px;
    }
     
    .xenForm .checkboxColumns.multiple > dd > ul
    {
        margin-bottom: 18px;
    }
     
    kovarnyi и Nicolayka нравится это.

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