XF 1.1 I can't add lines to EXTRA.css

Vuxxy

New member
I want to remove the help and members pages from showing on my nav bar, but everytime I go to add lines of code to the .css .. i get this error...

The following error occurred:
The following templates contained errors and were not saved: EXTRA.css: 1) Line 174: Invalid condition expression
 
/* no Help tab in navbar */
li.navTab.help{
display: none;
}

/* no Members tab in navbar */
li.navTab.members{
display: none;
}


I have also tried other codes that people have posted. Nothing I try will go through on the CSS :/.
 
My apologies. I thought you wanted the code I was attempting to add. Here is my Extra.CSS..

/* iOS Fixes */
#QuickSearch .formPopup .textCtrl, .button.primary, .button, .textCtrl
{
-webkit-appearance: none;
}

.navTabs .navTab.PopupClosed .navLink:hover
{
color: #232323 !important;
}

.navTabs .navTab.PopupClosed:hover
{
background: none !important;
color: #232323 !important;
}

.navTabs .navTab.PopupClosed:hover .SplitCtrl
{
/* nav_menu_gadget, height: 17px */
background: transparent url('styles/xenfoogle/xenforo/xenforo-ui-sprite.png') no-repeat -128px {xen:calc '(@headerTabHeight - 17) / 2 + 1'}px !important;
}

#QuickSearch .formPopup
{
background: none !important;
}

/*#QuickSearch.active
{
background: @primaryLightest !important;
border: 1px solid @faintTextColor !important;
}*/

#QuickSearch .formPopup .textCtrl
{
border: 1px solid @faintTextColor;
padding: 7px 3px;
border-radius: 3px !important;
}

#QuickSearch input.button.primary
{
width: 100px !important;
}

#QuickSearch .moreOptions
{
width: 100px !important;
}

#QuickSearch .Popup .arrowWidget
{
background: rgba(0, 0, 0, 0) url('styles/xenfoogle/xenforo/xenforo-ui-sprite.png') no-repeat -64px 0 !important;
}

#QuickSearch .PopupOpen .arrowWidget
{
background: rgba(0, 0, 0, 0) url('styles/xenfoogle/xenforo/xenforo-ui-sprite.png') no-repeat -48px 0 !important;
}

.button.primary
{
background-color: @primaryLightish !important;
border-radius: 3px !important;
}

.sidebar .secondaryContent
{
border: 1px solid @faintTextColor;
}


.messageUserBlock .arrow {
border-color: transparent @faintTextColor transparent transparent !important;
border-style: solid solid solid none !important;
border-width: 0px 28px 30px medium !important;
right: -17px !important;
top: 45px !important;
}

.messageUserBlock .arrow span
{
border-color: transparent #FCFCFF transparent !important;
border-style: solid solid solid none !important;
border-width: 0 28px 30px medium !important;
left: 2px !important;
top: 1px !important;
}

/*.messageUserBlock .extraUserInfo dt {
display: inline !important;
}*/

.InlineModChecked .messageUserBlock .arrow span
{
border-right-color: @inlineMod !important;
}

.quickReply
{
border: 1px solid @faintTextColor !important;
border-radius: 2px !important;
}

.conversation_view .messageList
{
border: 1px solid @faintTextColor;
}

.profilePage .mast
{
border-right: 1px solid @faintTextColor !important;
}

.profilePage .primaryUserBlock
{
border-top: 1px solid @faintTextColor !important;
}

/* === Resource Manager Fixes === */

.downloadButton .inner
{
line-height: 17px !important;
}

.downloadButton.purchase .inner
{
line-height: 32px !important;
}

.resourceListSidebar .secondaryContent
{
border: 1px solid @faintTextColor;
}

.resourceListItem .main .cost
{
background: @primaryLightish !important;
color: @contentBackground !important;
border: 1px solid @primaryDark !important;
border-radius: 2px !important;
padding: 3px 2px 1px !important;
}

.userBanner
{
border-radius: 2px !important;
}

.userBanner.bannerStaff
{
background: @primaryLightish !important;
color: @primaryLightest !important;
border-color: @secondaryDarker !important;
}

.userBanner.wrapped span
{
background: none !important;
}

/* Responsive View */
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveMediumWidth)
{
#QuickSearch
{
top: -25px;
}

#navigation .menuIcon:before
{
top: 11px;
}
}

@media (max-width:@maxResponsiveNarrowWidth)
{
}
</xen:if>
 
That looks like the EXTRA.css from one of styles. Looks like to many brackets in the responsive class.

Code:
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveMediumWidth)
    {
        #QuickSearch
    {
    top: -25px;
}

    #navigation .menuIcon:before
    {
        top: 11px;
    }
}

needs to be

Code:
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveMediumWidth)
{
     #QuickSearch
    {
        top: -25px;
    }

    #navigation .menuIcon:before
    {
        top: 11px;
    }
}

Edit: nvm that all looks ok actually...
 
Last edited:
Are you on 1.2 or 1.1 as your prefix states? If you are on 1.1, remove that entire <xen:if></xen:if> and the code in between. Responsive and @enableResponsive aren't available in 1.1.
 
Back
Top Bottom