Slickgrid pager within Dynamics CRM having one icon per line - slickgrid

I am developing an application which runs within Microsoft Dynamics CRM (MSCRM). Essentially in this environment web resources including HTML, JavaScript, CSS and image files are stored within the system the can be referenced on pages. I've got SlickGrid running but have an issue where the pager buttons each occupy a whole line. The key part of the HTML is:
<div id="SPLocation" style="width:100%; height:80%">Grid</div>
<DIV id="SPPager" style="width:100%;height:20px;">Pager</DIV
but it looks like this:
!http://www.clew-consulting.com/Temp/SGIssue.png
(hope this image works). Note each icon occupies a whole row. I've checked all the styles and images and they seem fine. The icons are functional.
The cause is probably that display:inline-block is not being picked up but it is there in the style sheets. It could be something special to do with the environment within MSCRM but the other markups all look fine.
Unfortunately I cannot run IE developer and show this part of the screen where I could inspect the CSS.
Anyone any ideas? I know I have not posted all information.
Paul

The pager styles are defined in slick.pager.css file.
Place this file in your css folder and add the following line to your html file
(do not forget to replace [path to your file] with your real path):
<link href="[path to your file]/slick.pager.css" rel="stylesheet">

Related

Rails does not load the html structure

I'll love if you can help me with a problem.
I'm developing a task app (just to practice) and I started with the styles using SASS.
Just to validate that the SASS is running I added a body background color, but this style does not applying for all views.
When I saw the console to see the html structure, I noticed that some views doesn't have the html structure from the application.html.erb, just the html that I have in that file.
NOTE: I have the style applied in a main.scss file, where all the files should have the style.
This is the root route
This is another view, where the style is applied
EDIT: I found the next message when inspect the element, but I don't know why is this happening

How to change the default logos in create-react-app

I'm working on a create-react-app project in VS code and would like to change the default logos (specifically the one that appears in the tab to the left of the website title).
I have an image that I would like to use, but I can't figure out how to add the image to VS code. I tried making a .png file, but wasn't able to add the picture into the file. I tried the same thing with a .ico file. I honestly don't understand the difference between the two. But if someone could help me with steps on how to change that logo (blue atom looking thing) that would be great.
This depends on how you want to put it.
add to html file(probably index.html)
<link rel="icon" href="pathname">
add Node.js file assuming that you are also using express.
var favicon=require("serve-favicon");
app.use(favicon("pathname"));

CK Editor uploaded images needs to respond as responsive images

I am using CK Editor 5 and a Simple upload adapter which works fine. All text and images from the editor is stored into a database when submitted. Also working just fine.
But when I reload and present the data/html it's not behaiving as expect. I need for the images to be responsive if I alter the width of the browser, but the images are quite static.
CK Editor has produced the following HTML (snippet is only the image part)
<figure class="image">
<img src="/img/article/160742759333072416.jpg">
</figure>
What do I need to do to make CK Editor produce HTML which supports responsive images?
Note: I am not able to use CK Editors 'Easy Image' Cloud option. I need to use an my owb om prem solution.
Looking forward to suggestions or pointers...
Blasted. After reading documentation for at last 3 more hours I noticed a CSS mistake I did myself while examining my code.
Bad!
Sorry to disturb you all and happy holiday season to all.

SyntaxHighlighter not showing toolbar

I am using the latest SyntaxHighlighter within my app and for some reason the toolbars do not show in IE, Firefox or Chrome. The code highlights without issue, but I want to have toolbars. What makes things worse is that the toolbar demo on the official website is not working either.
Am I missing something obvious? Below are the code nuggets.
<script src="Scripts/syntaxhighlighter/scripts/shBrushCSharp.js" type="text/javascript"></script>
<link type="text/css" rel="stylesheet" href="Scripts/syntaxhighlighter/styles/shCoreDefault.css" />
<script type="text/javascript">
// Highlight code
SyntaxHighlighter.all();
</script>
<pre class="brush: csharp; ruler: true; title: 'Test'; toolbar: true;">
public static bool HelloWorld()
{
// Return
return false;
}
</pre>
I've been trying to figure this one out myself. I won't claim to be 100% correct here, but from what I can tell, this is the answer:
Toolbar was changed in update from version 2 to version 3.
Toolbar no longer includes the icons and whatnot.
The default toolbar is now the simple '?'.
This pretty much sucks, if it's true. The pop-up toolbar w/ icons is one of the things that made me choose SH over the other options.
This is what I'm guessing comparing the included CSS files in the latest package to the CSS available on sites that have a version with the "proper" toolbar enabled.
Here's a link to one I was snooping in: ramymostafa.com
While I would like the toolbar myself, it seems that one of the toolbars features - copy & paste - have been included without the need for a toolbar item:
If you double click anywhere on the code, the entire code view is replaces with a pre-selected view from which users can copy with a simple Ctrl/Cmd-C. Clicking anywhere else returns the view to the original state.
http://alexgorbatchev.com/SyntaxHighlighter/whatsnew.html#copytoclipboard
I would still like the pop out feature, but less buttons is a good thing, I guess?
the same problem here. looks like there is no toolbar in v3.
i use v2 again: http://alexgorbatchev.com/SyntaxHighlighter/download/download.php?sh_2.1.382
if you copy the css and js around, don't forget to include the images in folder styles
The toolbar can be easily be showing simply go to the plugin configuration, on the Highlighter Version set to VERSION 2X. This way the toolbar will be shown again!
I confirm that in Version 3 the toolbar does not show.

AbcPdf - document not applying CSS

This may be more of a tech support issue, but I'm wondering if any other developers have come across this:
I'm using Abcpdf in my ASP.NET code to generate a PDF from HTML. It works fine, but one user is generating PDFs that don't have the CSS applied (IE8, Adobe Acrobat latest version - same as everyone else). Since this is the only user complaining, I'm sure it's a local setting, but I can't figure out what would prevent the css from loading - a browser setting? An Acrobat setting?
Does anyone have any suggestions?
Perhaps an issue with different versions of Acrobat reader? I'd look into this.
This doesn't make a lot of sense because AbcPdf uses service side logic to create the PDF based on what methods you are using to create the document (ex. AddImageUrl vs drawing out the document manually, etc.).
For what it's worth the staff at WebSuperGoo (the vendor of AbcPdf) is great with replying to support questions such as this. I've run across a few edge cases with their product that they've always followed up with workarounds or alternatives to address in a timely manner.
make sure you have media="print" for the CSS style sheet! Just spent ages looking at this pulling my hair out and was about to email WebSuperGoo then that thought came to me.
just about to back out all the changes I've made to my code and test again but it looks like with EngineType.Gecko it needs to be media="print" where as with EngineType.MSHtml it can be media="screen".....
very odd but hope that helps someone!
Make sure that the CSS is an absolute URL rather than relative, or add a base tag to the header of the HTML
For example, rather than
<style type="text/css" href="/styles/somecss.css" rel="stylesheet" />
use
<style type="text/css" href="http://myserver.com/styles/somecss.css" rel="stylesheet" />
Also if you site is SSL or authenticated then you will have to either make the area with the stylesheet un-authenticated, or, set the password and username attributes of the PDF object so that ABCPdf can authenticate
You can try the following in version 9
doc.HtmlOptions.PageLoadMethod =
PageLoadMethodType.WebBrowserNavigate;
I am using Version 10 of ABCpdf and I found that the style sheet path should be absolute instead of relative.
I changed the stylesheet path from "C:\MyProject\Resources\Styles.css" to "http:\www.MyDomain.com\Resources\Styles.css" and it worked.
Although, version 6 seems to be working with relative paths. I didnot check it with other versions
As per WebSuperGoo support:
(Query # : 6.17)
HTML does not exist within a file and so it does not have a location.
External stylesheets and images are often referenced via relative URLs. Because the HTML has no location it is impossible to resolve
these relative references.
So you need to provide your stylesheet and image links as absolute references. Or you may be able to use the HTML BASE element to specify
an appropriate base location. Or you can save your HTML to file in an
appropriate location and then use AddImageUrl.
Have you tried;
theDoc.HtmlOptions.DoMarkup = true;
This forces the engine to process the HTML before rendering.

Resources