Search Posts

Category: twitter-bootstrap

Making a responsive navbar layout with two logos and centered text

I need to do a responsive navbar with: LOGO1(left side) text(centered) LOGO2(right side) I am trying the next but It doesnt work when when resized to small screens. Here is my problem: when in “lg” size the screen is correct. But when in “md” size or smaller the LOGO2 goes to left side. And, in ‘xs’ size the ‘text’ continues showing with the LOGO2 below it. In my markup code I have some angular staff, […]

Angular 2, Using Jquery to Manipulate Bootstrap

I’m pretty new with NG2, and I’m trying to add Slide Up/Down effects do default Bootstrap 4 Dropdown component. The Bootstrap dropdown component has 2 Jquery Listeners $(el).on(‘show.bs.dropdown’) and $(el).on(‘hide.bs.dropdown’). So I created a directive to add this effects: import { Directive, OnInit, AfterViewChecked, ElementRef, Input } from ‘@angular/core’; import * as $ from ‘jquery’; @Directive({ selector: ‘[appDropDownAnimate]’ }) export class DropDownAnimateDirective implements AfterViewChecked { @Input() appDropDownAnimate: boolean; private el = this.ElementRef.nativeElement; constructor(private ElementRef: ElementRef) […]

why my overlay cannot cover bootstrap nagivation bar?

I’m trying to add overlay in my project to protect user not to make a lot of interaction before content are fully downloaded. That’s why I’ve added overlay as follow: .overlay { opacity: 0.5; background: #000; width: 100%; height: 100%; z-index: 10; top: 0; left: 0; position: fixed; } But problem is that overlay can cover 100% of all entire page except bootstrap navigation bar. Please help me how to cover that overlay on bootstrap […]