Comments (10)
@peio72 I played with angular material framework. The calendar can be nicely embedded into content as the screenshot.
But the calendar currently depends on bootstrap. So I have to add bootstrap into the reference. Not sure if it will cause any compatibility issue.
from angularjs-responsivecalendar.
Hello, thanx for this test. The idea would be to get rid of bootstrap and use only the angular material framework. Juste need to modify the templates using specific framework code. Could you tell me if possible and if could help for this.
from angularjs-responsivecalendar.
I tested with my app and i can confirm bootstrap.css is creating issues with the angular material framework components. So really need a specific template version.
from angularjs-responsivecalendar.
Yes, I think it's possible. The bootstrap css classes the calendar depends on are the grid system and some icon. As long as there's equivalent css classes, then should be easy to get rid of bootstrap.
from angularjs-responsivecalendar.
Please could you explain how to proceed ? Which files need to be modified for new templating ?
from angularjs-responsivecalendar.
First you need to fork my repository.
Then in the template/rcalendar folder, it stores the template html files.
In calendar.html, the div with "calendar-navbar" is using some bootstrap button icons and grid system to generate the navigation bar. You can fully replace them with angular material directives.
In month.html/week.html/day.html, the dependent bootstrap classes are "table", "table-bordered", "table-striped", "table-fixed". They just make the table occupy full width and provides the border and background colour. You can achieve the same effect by using your own styles.
After you made the change, you can run the "grunt build-tpls" to generate the minimized version in the list folder.
Feel free to let me know if you need more explanation. Thanks.
from angularjs-responsivecalendar.
Ok I tried but not success manipulating your code to adapt to material design equivalent. I give up. Maybe you could be interested to port it to angular material one day.
You can have a look at this basic plugin:
https://github.com/jsmodules/angular-material-calendar
from angularjs-responsivecalendar.
Sure, I will take a look.
from angularjs-responsivecalendar.
@twinssbc , Have you looked at that plugin. I need Angular Material support too!!
Thanks for the great plugin!! 👍
from angularjs-responsivecalendar.
@TejasCMehta As I said in the previous comments, you can still embed the calendar into Angular Material. It just won't be that fancy like angular-material-calendar as it's using native control.
I certainly will look at porting my calendar to Angular Material, but I'm a bit busy right now, so probably won't build a version in short term.
from angularjs-responsivecalendar.
Related Issues (20)
- Layout on hours column is messy HOT 6
- How to give to onTimeSelected() event informations ? HOT 1
- Week and day view horizontally vs current vertical design ? HOT 1
- Entries don't appear in iOS HOT 2
- View is not updating when query-mode is set to remote HOT 1
- Not getting arrows on top header as shown in Example HOT 1
- The time interval is not displayed correctly. HOT 6
- Problem opening calendar in mobile browser HOT 6
- AngularJS-ResponsiveCalendar with ionic HOT 1
- Selected day (today) stays selected when moved to next/prev month HOT 2
- Events with different colors, please add this simple fucntionality HOT 6
- 日期限定 HOT 1
- How to select custom date on initial load of calender? HOT 1
- Day view customised start time (From 10 AM rather than 12 AM)
- Migrate to Angular? HOT 2
- time-selected doesn't trigger in "month" view HOT 1
- how to show calendar in spanish HOT 2
- How to Display Current time indicator HOT 4
- Can we show two or more appointment according to person name in Day View? HOT 1
- Set options HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from angularjs-responsivecalendar.