I work with Jade (pug) and Nodejs.
I created a dropdown button, so that user can choose an item, but it didn't show in the application. There is no dropdown there. I've already use display:block and clean the browser cache. But still stuck here.
Here is my .pug file:
.filters-nav
.btn-group.m-r-15
button.btn.btn-inverse.dropdown-toggle.waves-effect.waves-light.btn-custom(type='button', data-toggle='dropdown', aria-expanded='false')
span.btn-label
i.fa.fa-filter
| Add filters
span.caret
ul.dropdown-menu.filters-dropdown(role='menu')
li
a(href='#', data-filter='table_1_filter_0') Instrument ID
li
a(href='#', data-filter='table_1_filter_1') Instrument Code
I wonder if it is CSS, but all I know is CSS doesn't related to element visibility at all.
Maybe this will help, its pug plus the css
li.dropdown.btn.btn-default
span.glyphicon.glyphicon-th-list
............
https://codepen.io/thehumanscience/pen/qbLepW
Related
Currently, my title overlays my cover image on my pages and posts. I do not like this and want it either hidden or removed. I've tried plugins and they don't work. What code can I use to do this? I have a child theme.
My Site with example of this: https://intentionaldetours.com/example-laos-article/
Plugins that didn't work and messed up my menu. I just want this text deleted on the display, I need it to show up in other areas of the site
Don't have any
Titles either not displaying at all on pages, and for post below the featured image
Do you want remove the text "Example Laos Article 2 months ago"? Is it?
If so, you can add some CSS code to hide it.
Something like:
.entry-header {
display: none;
}
I've been playing around with Extension Library Navigator for a while and I can't figure out how to make the selected (or the current opened pages basic node) node to change any of the looks properties, for example font or color. I'm trying to do that so that user can tell what page is currently opened. Any tips on how to do that?
Another option, which is not as simple as the one suggested by Per, is to do the customization via a bit of script.
For example, I have built my site navigation with pure HTML and bootstrap.
My link HTML looks like this
<a id="YOURLINKIDHERE" href="vwBringUpsByDate.xsp">Bring ups</a>
When a page loads, you can then then use the below script to customize your selected menu item exactly how you like, fonts, colours, backgrounds etc just by referencing the link ID....
<xp:eventHandler event="onClientLoad" submit="false">
<xp:this.script><![CDATA[$("*[id$='YOURLINKIDHERE']").css('background-color', '#eeeeee');]]></xp:this.script>
</xp:eventHandler>
Not ideal, as you have to put the script on each page that you want to modify a menu link with, but gives you some good customization options...
On my page I want to disaply a Polymer Paper-Dialog so I wrote an own element that looks like this:
<polymer-element name="my-dialog" constructor="MyDialog" extends="paper-dialog" noscript>
<template>
<span>I'm a dialog!</span>
</template>
</polymer-element>
Now I tried to display the dialog with this JS code:
var dialog = new MyDialog();
dialog.toggle();
But the dialog does not show up. Any ideas why?
When you are creating a new Dialog in your javascript function, you aren't adding it to the DOM anywhere. So, when you call toggle on it, it tries to show/hide a dialog that hasn't been added to the page.
If you want this to work, you should be adding the markup for the dialog to your html, getting a reference to that element in javascript, and then calling toggle.
Something else you could consider doing is looking at the Core-Overlay polymer element. It handles a lot of the dialog functions for you, and even allows you to shade everything that isn't in the dialog itself.
I'm trying to create a CSS documentation library in Orchard. I want to save a description, CSS snippet and HTML snippet against each content type. The first view would show the description and CSS and HTML code written out. The second view would show a preview of what the CSS and HTML look like rendered.
cssdocumentation.com/content/item1
cssdocumentation.com/content/item1/live-preview
I've created the content type and the first view. But I'm not sure how to create the second view. I can see if I can create the alternative URL I can use the Url Alternates module to create an overriding .cshtml
To create an alternative URL I've looked at the autoroute module but this only allows you to adapt a single URL (unless I'm missing something?) and I've looked at Alias UI but this forces me to manually create an alternative URL everytime I create a content item.
Is this possible in Orchard without writting too much C#? (I'm a frontend developer so I only dabble in the behind the scenes stuff)
Thanks for any help
Best solution is to do this within your own module. But as a secondary option instead of having a second page, combine this content with your first page and hide it with CSS. When the user clicks a button to navigate to the next step render the CSS/HTML result on the same page. You can do this in many ways, here are a few ideas:
Render the CSS/HTML result out straight away on the same page but hide it. Show it when the user clicks a button
using jQuery to render the result on the client side. More dynamic if you allow editing of the HTML and CSS.
Redirecting the user to the same page with specific url parameters which you can pick up in your alternate to modify the output.
I wish to add a new menu item/link (e.g. "Stack Overflow") at the end of the menu in the screenshot below.
The new link URL would end in the community_uuid e.g. http://example.stackoverflow.com/some-page#community_uuid
Is there any good documentation available to show how this is done?
Immediately I thought of three things:
1 - Custom CSS for a community, so you could somehow add/change or maybe create a landing spot for a dom manipulation event which adds it.
In order to change the CSS, You should look at:
http://infolib.lotus.com/resources/oneui/3.0/docPublic/components/menu.htm
It's the navbar role.
In a folder such as /local/con/opt/IBM/WebSphere/AppServer/profiles/AppSrv01/installedApps/conServerCell/Communities.ear/comm.web.war/nav/common/styles/orangeTheme/
2 -
You may also want to look at /local/con/opt/IBM/WebSphere/AppServer/profiles/AppSrv01/config/cells/conServerCell/LotusConnections-config/widgets-config.xml
specifically
you could add a StackOverflow widget, when loaded it automatically opens up a new window, and transfers the person back to the previous page. ... a little bit of a kluge...
3 - Look for /local/con/opt/IBM/WebSphere/AppServer/profiles/AppSrv01/installedApps/conServerCell/Communities.ear/comm.web.war/nav/templates/page.jsp
find the line
<div class="lotusMenu" id="lotusMenu" style="display:none;" role="navigation" aria-label="Main navigation"><div class="lotusBottomCorner"><div class="lotusInner">
<div id="lotusMenuTree"></div>
</div></div></div>
You could modify the very end to add some custom link for you.
Just some quick thoughts...