Thread: [Cppcms-users] CSS example

SourceForge Headquarters 225 Broadway Suite 1600 San Diego, CA 92101 +1 (858) 422-6466

Hi,

I am learning CPPCMS, but could not find an example for css in the source
/example, is there any example code for css?

Appreciate your help.

Thank you.

Kind regards,

- j

On Sat, Jul 22, 2017, at 04:01 PM, jupiter wrote:
> I am learning CPPCMS, but could not find an example for css in the source /example, is there any example code for css?
Just embed <link> tags

<link href="my_style.css" rel="stylesheet" type="text/css" />

in your output as you  would embed them in your usual static html file.
For example, a template with <link> tag might look like this:

<% c++ #include "my_file.h" %>
<% xhtml %>
<% skin view %>
<% view my_view uses content::my_content %>
<% template render() %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title><% gt "This is my first page." %></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="my_style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1><% gt "CppCMS Rocks" %></h1>
</body>
</html>

Best Regards,
CN

-- 
http://www.fastmail.com - Accessible with your email software
                          or over the web

Thanks for the response. I know I need to add the external css in the
template file, I built it, the  ran the css -c config.js and
http://localust:8080/css, but that did not show the background color
defined in style.css. I copied the first.tmpl to index.html and I could see
the background color from file:///tmp/index.html. That is why I was asking
what was the difference between an html file and cppcms template file??

$ cat first.tmpl
<% c++ #include "content.h" %>
<% skin my_skin %>
<% view message uses content::message %>
<% template render() %>
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<h1>Title: <%= title %></h1>
<p>Content detail: <%= text %>, value = <%= value %></p>
</body>
<html>
<% end template %>
<% end view %>
<% end skin %>

$ cat style.css
body {
    background-color: #abc123;
}

h1 {
    color: white;
    text-align: center;
}

p {
    font-family: verdana;
    font-size: 20px;
}

On Sun, Jul 23, 2017 at 3:39 AM, CN <cn...@fa...> wrote:

> On Sat, Jul 22, 2017, at 04:01 PM, jupiter wrote:
>
> I am learning CPPCMS, but could not find an example for css in the source
> /example, is there any example code for css?
>
>
> Just embed <link> tags
>
> <link href="my_style.css" rel="stylesheet" type="text/css" />
>
> in your output as you  would embed them in your usual static html file.
>
> For example, a template with <link> tag might look like this:
>
> <% c++ #include "my_file.h" %>
> <% xhtml %>
> <% skin view %>
> <% view my_view uses content::my_content %>
> <% template render() %>
> <html xmlns="http://www.w3.org/1999/xhtml">
> <head>
> <title><% gt "This is my first page." %></title>
> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
> <link href="my_style.css" rel="stylesheet" type="text/css" />
> </head>
> <body>
> <h1><% gt "CppCMS Rocks" %></h1>
> </body>
> </html>
>
> Best Regards,
> CN
>
> -- http://www.fastmail.com - Accessible with your email software
>                           or over the web
>
>
> ------------------------------------------------------------
> ------------------
> Check out the vibrant tech community on one of the world's most
> engaging tech sites, Slashdot.org! http://sdm.link/slashdot
> _______________________________________________
> Cppcms-users mailing list
> Cpp...@li...
> https://lists.sourceforge.net/lists/listinfo/cppcms-users
>
>

On Sun, Jul 23, 2017, at 07:11 PM, jupiter wrote:
> Thanks for the response. I know I need to add the external css in the template file, I built it, the  ran the css -c config.js and http://localust:8080/css, but that did not show the background color defined in style.css. I copied the first.tmpl to index.html and I could see the background color from file:///tmp/index.html. That is why I was asking what was the difference between an html file and cppcms template file??
Then I would check whether or not the HTTP server can find and read file "style.css".
Regards,
CN

-- 
http://www.fastmail.com - Send your email first class

Thanks for the response. I tried to debug myself, but no avail. Anyway in
my firefox browser it had following messages. If I understood it correctly
that the style.css was loaded but it had no effects, and I don't know what
other messages mean. If I put the style.css into an html file, it works.
What could be the problems that the style.css did not work in the template
file?

The stylesheet http://localhost:8080/style.css was loaded as CSS even
though its MIME type, "text/html", is not "text/css". localhost:8080
Selector expected.  Ruleset ignored due to bad selector. style.css:2:0
Unexpected end of file while searching for closing } of invalid rule set.

On Sun, Jul 23, 2017 at 11:54 PM, CN <cn...@fa...> wrote:

> On Sun, Jul 23, 2017, at 07:11 PM, jupiter wrote:
>
> Thanks for the response. I know I need to add the external css in the
> template file, I built it, the  ran the css -c config.js and
> http://localust:8080/css, but that did not show the background color
> defined in style.css. I copied the first.tmpl to index.html and I could see
> the background color from file:///tmp/index.html. That is why I was asking
> what was the difference between an html file and cppcms template file??
>
>
> Then I would check whether or not the HTTP server can find and read file
> "style.css".
>
> Regards,
> CN
>
> -- http://www.fastmail.com - Send your email first class
>
>
> ------------------------------------------------------------
> ------------------
> Check out the vibrant tech community on one of the world's most
> engaging tech sites, Slashdot.org! http://sdm.link/slashdot
> _______________________________________________
> Cppcms-users mailing list
> Cpp...@li...
> https://lists.sourceforge.net/lists/listinfo/cppcms-users
>
>