I have a website under development (http://www.snippet-monkey.com). This site was developed with Twitter Bootstrap and Rails3.
Now the layout shows different behavior in different browsers. It works fine on all browsers in my laptop, but fails in other machines and works in many others.
How could i convert this layout to responsive?
Any help is really appreciated.
Add #import "twitter/bootstrap/responsive";
to your bootstrap_and_overrides.css.less file
By default these days bootstrap isnt configured to be responsive , you have to add this feature in, this is the simplest way
Related
I'm working on two webapps built with Nuxtjs which are like e-learning apps. One app (App1) acts as a CMS from which a teacher prepares courses, and in and the other app (App2) is like an end result where a student can go through the content created.
Now I want to implement an instant preview of the App2 in the App1 when content is being built.
So I was wondering what the best approach, that's quick and seamless, is to go about it?
I was thinking of sharing the components in an NPM package between the two apps but the thing is that almost all the pages of the App2 should be used in the App1.
Or loading the App2 in an Iframe in the App 1 but no sure how to instantly show the changes being made in App1?
All ideas given is appreciated in advance.
As I guess you want to create two apps that have common components, and different logic, sharing components via npm package is a really good idea, I think you can also use Layout feature, you can have more than 2 scenes, But that can make the app little bit complex, it depends on how to organize your business logic.
I had to recently updgrade from jQuery 1.3 to 1.10. As a result lots jquery code was changed and plugins were upgraded. And consequently this resulted in lot of hours of manual testing.
This got to me think that there should be a better way of testing/validating pages after any js/css change across my site.
I would like to do the following.
crawl all pages on my site.
Check all links on page work correctly
Check for basic html tag validation
Check for any JS & css errors.
jquery version compatible code
Any recommendations for tools that will allow me to perform all of the above test.
Thanks
Free tools exist for quite many of those tasks. There are both web page based validators and browser plugins. I don't know if some tool would do all the below in one or couple steps, but these should get you at least started.
For crawling the site and checking all links you can use tool from The World Wide Web Consortium (W3C):
http://validator.w3.org/checklink
The results page also provides links for for validating html and css of each page.
If you want to validate a file otherwise, you can straight use
http://validator.w3.org/
and
http://www.css-validator.org/
For validating javascript syntax, you can use jslint
Finally, if you want to be more sure that your javascript is working correctly, write unit tests for example with QUnit
I am about to start building a mobile site which is dynamic, working from a lot of dynamic content which must come from the database.
I have already written a REST API for the site which the IOS and Android applications are using to interact with the information.
My question is what would be the absolute best practise for building this site, would it be:
1- Make the mobile classes an extension of the existing site functions
(The downside I see here is that the mobile site would be dependant on the main site library meaning that any bad heat on the main site would also affect the mobile site)
2- Make the mobile site a completely stand alone site running from itself
(The downside I see here is that any change to the main site library will need to be reflected here so in essence we would almost be writing code twice)
3- Make the mobile site run from the REST API and standalone
(The downside i see here is just increased number of HTTP requests for the information rather than communicating with the server directly)
Each one would function normally and there wouldn't really be any problem there, coding is really not too difficult, though if I make it standalone I would need to recreate a lot of the functions from the main site and adapt them for the mobile site which isn't ideal.
Look forward to your comments! Thanks
I would go with 3rd point, but that needs to be architect well.
We will prioritize standalone application after that API, also we can have 2 way communication, any content changed on server it will coordinate with clients to get that updated.
Also I would also suggest go with Bootstrap framework, its an awesome framework and have responsive and adaptive design
Is there a way to display a web page inside an application done with mono framework. It is a cross platform application, so it would be great if the solution is in mono. It need not be a generic browser, i just need to display the web pages from my own server. The number of pages is too much also it will be updated often, so cannot include it in the app itself.
Any help would be really great. BTW the app will be for most of the mobile platforms, like android and iPhone.
I am stuck on developing a mobile view for my SP2010 publishing portal. It is Internet-facing with custom pages / web parts (e.g. http://server/Pages/customPage.aspx with custom webparts on it). The site has a custom master page.
I am having the following issues with the built-in mobile functionality:
The welcome page. Navigating to
http://server/?Mobile=1 redirects me
to
http://server/_layouts/mobile/mbllists.aspx, which just shows a table of lists / document libraries available. For
my portal, I want to show a
dashboard, just like I currently do for the "normal" non-mobile view.
Navigating to one of my custom
pages (e.g.
http://server/Pages/customPage.aspx?Mobile=1)
also redirects to
http://server/_layouts/mobile/mbllists.aspx.
So in effect there is really no helpful built-in mobile support at all; just the ability to view lists with a mobile device.
So I have a number of issues and I'm hoping for some high-level help. My thought is that I should do the following tasks:
Create a separate master page for mobile
Figure out how to choose this master page based on "is client a mobile device?"
Figure out how to prevent the redirection to /_layouts/mobile/mbllists.aspx
Then I think the mobile site will operate similarly to the normal site.
Am I on the right track?
[Edit]
With what I have seen from links from #moontear and other research I've done, it sounds like my best option is to just disable built-in SharePoint mobile support, and just do my own conditional rendering based off of Request.Browser.IsMobileDevice.
Check out the extensive MSDN documentation about how to customize Mobile Views:
How to: Customize Mobile List View and Form Pages
when you check out that page you can see that you can already change the layouts of the list forms and maybe that is enough for you - but as you said you want a custom "Dashboard", you probably want to look into how the mobile redirection works:
Overview of Mobile Pages and the Redirection System
You can set which device is treated as mobile device by editing the compat.browse file as explained in this post: SP2010 Branding Tip #6 – Mobile Browsers, this way the device you set is shown your regular Sharepoint page (answering your questions 2/3).
Copy the "_layouts/mobile" folder to e.g. "_layouts/MyCompany/mobile", in webconfig add following appSetting key:
<add key="mobile_applicationrootdirectory" value="_layouts/MyCompany/mobile/"/>
After that you can add branding, css, etc. to your own mobile folder.
SharePoint is using this by calling SPMobileUtility.GetAppRootDirName()
http://msdn.microsoft.com/en-us/library/ee553908(v=office.14).aspx
using powershell
Disable-SPFeature -Identity MBrowserRedirect -Url http://url