bootstrap-4

Ng-Bootstrap Datepicker, how to highlight specific days in Angular4

由 余生颓废 提交于 2020-01-01 14:49:08
问题 I have an array of tasks, each contains a date. I would like to highlight the matching days in the datepicker but cannot seem to find in the documentation how to accomplish it. Anyone able to help? https://ng-bootstrap.github.io/#/components/datepicker/api Here is my typescript: import { Component, OnInit } from '@angular/core'; import {NgbDateStruct} from '@ng-bootstrap/ng-bootstrap'; const now = new Date(); @Component({ selector: 'app-dashboard', templateUrl: './dashboard.component.html',

Angular 5 ngx-bootstrap form validation

由 不打扰是莪最后的温柔 提交于 2020-01-01 09:57:08
问题 I'm reading Ari Lerner's ng-book on Angular 5. I'm using ngx-bootstrap and Bootstrap 4 . Form validation doesn't seem to be working the way Mr. Lerner implements. I'm not sure if this is a limitation of ngx-bootstrap ...anyone know? edit Ok, I removed ngx-bootstrap and just loaded up the MaxCDNs for Bootstrap 4 and I have the same problem. The error message is not appearing. app.module.ts import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core';

Angular 5 ngx-bootstrap form validation

由 喜你入骨 提交于 2020-01-01 09:56:14
问题 I'm reading Ari Lerner's ng-book on Angular 5. I'm using ngx-bootstrap and Bootstrap 4 . Form validation doesn't seem to be working the way Mr. Lerner implements. I'm not sure if this is a limitation of ngx-bootstrap ...anyone know? edit Ok, I removed ngx-bootstrap and just loaded up the MaxCDNs for Bootstrap 4 and I have the same problem. The error message is not appearing. app.module.ts import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core';

Bootstrap 4 Glyphicons not showing on Angular 4 project

由 你说的曾经没有我的故事 提交于 2020-01-01 08:07:49
问题 I'm working on an Angular 4 Project using Bootstrap 4 with Sass, and I want to use the glyphicons but when I use the following code: <button class="btn btn-sm btn-primary"><span class="glyphicon glyphicon-thumbs-up"></span>Like</button> For example, when making a "like" button, the icon doesn't show. I configured the project to compile the SCSS stylesheets with the ng-serve command, my angular-cli.json looks like this: { "$schema": "./node_modules/@angular/cli/lib/config/schema.json",

Bootstrap 4 Nav Bar fixed-top over content

由 自闭症网瘾萝莉.ら 提交于 2020-01-01 07:16:08
问题 I'm using bootstrap4 fixed-top navbar which works fine in normal browser. However, when I test on a mobile device (Galaxy S5 using chrome dev options) the content starts behind the nav bar, I've tried some padding in my css but I can't seem to get it to work correctly. Below is a jsfiddle of the HTML and CSS, the page content starts behind the fixed-top nav bar. https://jsfiddle.net/8kefh4u7/6/ Also here is my CSS html, body { height: 100%; } body { display: -ms-flexbox; display: -webkit-box;

Angular bootstrap date-range-picker in a popup?

由 送分小仙女□ 提交于 2020-01-01 06:30:10
问题 I am trying to show a date-range picker in my angular app using ng-bootstrap. My code looks like following: <ngb-datepicker #dp ngModel (ngModelChange)="onDateChange($event)" [displayMonths]="2" [dayTemplate]="t"> </ngb-datepicker> <ng-template #t let-date="date" let-focused="focused"> <span class="custom-day" [class.focused]="focused" [class.range]="isFrom(date) || isTo(date) || isInside(date) || isHovered(date)" [class.faded]="isHovered(date) || isInside(date)" (mouseenter)="hoveredDate =

Bootstrap 4 images thumbnail classes

由 Deadly 提交于 2020-01-01 03:33:11
问题 I got a HTML code in the following using bootstrap 3.3.7, using thumbnail class the images can be resized and fit into the grid perfectly. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Project</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> </head> <div class="container"> <h2>Pictures of Coffee</h2>

Prevent show simplified view prompt or work with simplified view on Chrome

由 懵懂的女人 提交于 2020-01-01 02:44:29
问题 I have a website which looks good if viewed the way I designed it. Every time I visit it from Chrome on Android, I am given a prompt along the bottom of the screen to "Show Simplified View". If I click that prompt to actually see it in simplified view, the site will only display 1 news item (there are supposed to be 25 on a page), it removes all controls (log in, add news item, comments), and scrolling doesn't work anymore. There are multiple other problems as well (headlines/images/article

Unable to override $theme-color in bootstrap 4

由 [亡魂溺海] 提交于 2019-12-31 10:41:58
问题 It's bootstrap 4.0 with SASS My style.scss file contains the following code: @import "../bootstrap/scss/bootstrap"; @import "colors"; @import "main"; and _colors.scss file contains the following code: $bg-white : white; $theme-colors: ( primary: #333333 ) You can see that I am just trying to override the $theme-color('primary') but the problem is this that it does nothing. And If I shift @import "colors" in the start of the file style.scss It gives me following error: error ../bootstrap/scss/

Add active class to menu item

由 為{幸葍}努か 提交于 2019-12-31 07:31:34
问题 Using Bootstrap 4 v6, I have the following navigation: I'm trying to set the active class on the selected menu item, but nothing I've done has worked. The closest that I've come is with this code: $(document).ready(function() { $('.navbar ul li').click(function(e) { $('.navbar ul li.active').removeClass('active'); var $this = $(this); if (!$this.hasClass('active')) { $this.addClass('active'); } e.preventDefault(); }); }); <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap
订阅 bootstrap-4