Link Stylesheet to local html page in c# wpf application - c#

I have a WPF with a browser control that points to a local HTML file.
I have my .html and .css files in a folder labelled WebResources but it seems no matter how I link the stylesheet in the index.html file the styling doesn't show.
My Solutions Explorer
Solution MyProject
-- MyProject
---- Properties
---- References
---- WebResources
---- Index.html
---- Style.css
Index.html
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="stylesheet" href="WebResources\Style.css" />
<!-- Also Tried "<link rel="stylesheet" href="Full\Path\To\Style.css" /> -->
</head>
<body>
<div class="container">
<h1>This should be very big</h1>
</div>
</body>
</html>
Style.css
h1 {
font-size: 10em;
}

If index.html and Style.css are in the same folder you should use:
<link rel="stylesheet" href="Style.css" />
I just tried with a test app and it works well.
Let me know.

Have you tried forward-slashes (/)? html pages usually reference other resources with these rather than Windows-style back-slashes

Related

Visual Studio Code Live Server: Not Works For Index.html using iframe tag

have a problem with Live Server Updating Index.html ...
It's works when i doing manually save... working with big project, and manually update every time page is too stupid deal
in Index.html I using Iframe to navigation.html ..
pay attention when i updating navigation.html it's working , updating ...
but when i trying to update index.html .. unfortunately ...
Here Is :::
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Pam dasd adsadsa dasdsa </h1>
<iframe 1 src ="navigation.html" linkTarget = "iframe2">
<iframe2>
</body>
</html>
navigation.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<ul>
<li>agent 1 link</li>
<li>agent 2 link</li>
<li>agent 3 link</li>
<li>agent 4 link</li>
</ul>
</body>
</html>
PS : Help -> Toggle Developer Tool , showing no errors, all working ok. i mean : [Extension Host] Change detected
Here is Repo:::
enter image description here
Maybe that it extension bug ? :)
PS:::
!!!Attention!!!
Without iframe tag Index.html .. Live is working well .
But i need iframe.
Is your index.html inside of a folder preceded by a period?
Does your domain look like this? http://127.0.0.1:5500/.folder/index.html

ASP.Net Core Blazor: How to load different _Host.cshtml files based on header value

I would like to load a _Host.cshtml file in an ASP.NET Core Blazor project (Server side Blazor) based on a header in the request.
For example:
A client connects to example.com and is redirected to a _Host.cshtml file specific for tenant A.
Another client connects to test.com and is redirected to a _Host.cshtml file specific for tenant B.
The _Host.cshtml file looks somehow like this:
#page
#addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<meta charset="utf-8" />
<title>ProjectName</title>
<link rel="icon" type="image/png" sizes="32x32" href="images/tenantA/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="images/tenantA/favicons/favicon-16x16.png">
</head>
<body class="something">
<app>
#(await Html.RenderComponentAsync<App>(RenderMode.Server))
</app>
<script src="_framework/blazor.server.js"></script>
<link href="css/tenantA/site.css" rel="stylesheet" />
</body>
</html>
In the _Host.cshtml file, the reference to tenantA needs to be set based on the above tenant selection from the tenant URL like described above. Is this possible and if yes how can this be achieved?
This is one possible solution ,
In _Host.cshtml
You can redirect to any _HostX.cshtml by a dynamic string logic
#page "/"
#addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
#if(Request.Query["test"].FirstOrDefault()=="1")
{
Html.RenderPartial("_Host2.cshtml",null,ViewData);
return;
}
<!DOCTYPE html>
<html lang="en">
<head>
....
...
..
.
This is tested.
You can modify the condition statement to match your case .

NReco.ImageGenerator doesn't show images and styles

I am trying to convert my simple html document into image. I am using NReco.ImageGenerator for this.
But it does not show included image and styles
I am using Windows 10
Here is my code
var html = File.ReadAllText("main.html");
var htmlToImageConv = new NReco.ImageGenerator.HtmlToImageConverter();
var jpegBytes = htmlToImageConv.GenerateImage(html, "png");
File.WriteAllBytes("image.png", jpegBytes);
It is html document
In browser
My code's output
The problem is that NReco will be unable to find the file of the image in the html.
Two possible solutions that immediately come to mind.
Host the image on a valid URL or use an inline image using base64 encoding in the html.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
<link href="style.css" rel="stylesheet">
</head>
<body>
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANwAAADcAQMAAAAhlF3CAAAABlBMVEX///8AAABVwtN+AAABCUlEQVRYhe3XMQ6DMAwF0I8YMuYIHIWjNUfjKByBkQGR2okTUFXaMPMttbR5TJadOIglAgB9YiwrC4iKEzT6GAb5PzvBNa3gRTT0mqn+lL61k8dOvIeSW8ARr1EqkHgfa/NuwCCN+72zH4wlFPP2VlaI//EUWn2X8Vy0TPXylasvTm7HuHR6IhAbMO1kApu9qc3rd8stMW9vegjE2p976tFAbECN4LXyZPwYLLfEA6UVc/rqhAHpT6s+4l+sMcQDbXsjhnIAaLFZ5UnDdulDbMEpJdaumLP+dvY20fB0xTzS54l3MZ8QUeeRMU//RHymr04YxFYszVvnW8svMZYbQI56CcepP4m/8Q15PctBEVIBfQAAAABJRU5ErkJggg==" />
<p class="text">Some text</p>
</body>
</html>
or use a local file url like file:///
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
<link href="style.css" rel="stylesheet">
</head>
<body>
<img src="file:///C:/Users/jdarling/Desktop/SO_20190718/images/back.png" />
<p class="text">Some text</p>
</body>
</html>

How to import a VS MasterPage in Ektron

I recently installed a new site in Ektron. It created all the folders and files necessary to have it working. I created a custom MasterPage in VS 2012 with own folders and CSS/Script files and looking to import it into Ektron to use.
I imported from Workarea > Settings > Template and import template.
When I click on View for the template, I am seeing the following error:
Parser Error Message: Could not load type 'WMED.Site'.
Source Error:
Line 1: <%# Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="WMED.Site" %>
Line 2:
Line 3:
Source File: /Site.Master Line: 1
How do I resolve the error
:: Should I remove the inherit and namespace from the MP for it to work?
The HEAD:
<head runat="server">
<title></title>
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta name="HandheldFriendly" content="True" />
<meta name="MobileOptimized" content="320" />
<meta name="viewport" content="width=device-width" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<link rel="icon" type="image/gif" href="favicon.gif" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<!--<script type="text/javascript" src="theScripts/sliderJS.js"></script>
<link rel="stylesheet" href="theStyles/sliderStyle.css" type="text/css" />-->
<link rel="stylesheet" href="theStyles/pageStyle.css" type="text/css" />
<link rel="stylesheet" href="theCustomFonts/trajanpro_style.css" type="text/css" />
<link rel="stylesheet" href="theCustomFonts/blackjar_style.css" type="text/css" />
<script src="theScripts/jquery.webticker.js" type="text/javascript"></script>
<link rel="stylesheet" href="theStyles/tickerStyles.css" type="text/css" />
<script src="theScripts/pageScript.js" type="text/javascript"></script>
<script src="theScripts/placeholders.min.js" type="text/javascript"></script>
<script src="theScripts/jquery.sidr.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="theStyles/jquery.sidr.light.css" type="text/css" />
<script src="theScripts/jssor.js" type="text/javascript"></script>
<script src="theScripts/jssor.slider.js" type="text/javascript"></script>
<script src="theScripts/jssorSlider.js" type="text/javascript"></script>
<link rel="stylesheet" href="theStyles/jssorSlider.css" type="text/css" />
<!-- ENSURES HTML TAGS ARE COMPLIANT -->
<!--<link rel="stylesheet" href="theStyles/styleDiagnostic.css" type="text/css" />-->
<script>
$(window).resize(function () {
var docHeight = $(document).height();
var docWidth = $(document).width();
$('#lbl').text("height: " + docHeight + " width: " + docWidth);
});
</script>
<script>
function SearchNMClick() {
document.getElementById('HiddenSearchNM').click();
}
</script>
<asp:ContentPlaceHolder ID="HeadPlaceHolder" runat="server">
</asp:ContentPlaceHolder>
</head>
You're probably using a Web Application project opposed to a Web Site. Because of this, the code for your MasterPages, ASPX templates, wireframes...etc. is compiled into a DLL (or DLLs) when you build the project.
When you deploy your Web Application project to your Ektron site, in additional to the files you've already pushed out, you have to copy your project's DLLs into the bin directory of the site. Your project will have a bin directory after building where you can find these, just look in File Explorer to find it if you don't see it.
/bin/WMED.dll
Also, if this is the case, do not push your .cs files to the server.
You don't need to import a MasterPage into Ektron, only ASPX templates are imported. The process is, create your ASPX template (with associated MasterPage), save it into your website and then register it with Ektron.
Check the master page's code behind file (the .cs) and make sure that the public partial class looks like public partial class WMED.Sitename is using the same. Also make sure that the .cs file is located in the same directory as the .master template.

Bootstrap not working with MVC4

I´ve downloaded tweeter bootstrap (not the bootststrap for MVC) to a brand new MVC4 project, but I can´t make it work.
No errors in browser´s F12 window.
Here is my _layout code:
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="#Url.Content("~/Content/bootstrap-theme.min.css")" rel="stylesheet" media="screen">
</head>
<body>
<script src="#Url.Content("~/Scripts/jquery-2.0.3.min.js")"></script>
<script src="#Url.Content("~/Scripts/bootstrap.min.js")"></script>
<h1>Hello, world!</h1>
#RenderBody()
</body>
</html>
When the screen pops up, I get a normal Hello, world! body (no bootstrap fonts). My system has the following files:
What may I be doing wrong?
You only included the bootstrap-theme.min.css file and not the base bootstrap.css file. (though you did include the bootstrap.js file)

Categories

Resources