Home Explore
Sign In
dcmods
/
calc
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Merge branch 'add-css' into 'master'

Add some example CSS

## What does this MR do?

- add some minimalist CSS
- show an example of how to correctly reference CSS

## Are there points in the code the reviewer needs to double check?

Not really...

## Why was this MR needed?

The README mentions wrongly referencing CSS in Troubleshooting but does not show an example of how to do it right.

## What are the relevant issue numbers?

None.

## Screenshots

## Before

![before](/uploads/475480ff7d9326bc32f030a4762ba94d/before.png)

## After

![after](/uploads/0a49104df21ca3c52a05ac346411c034/after.png)

See merge request !12

Achilleas Pipinellis 8 years ago
parent
d396283bb2 364530107f
commit
04984f7cbf
3 changed files with 33 additions and 1 deletions
Split View Show Diff Stats
  1. 2 1
      README.md
  2. 7 0
      public/index.html
  3. 24 0
      public/style.css

+ 2 - 1
README.md
View File 

@@ -55,8 +55,9 @@ unless you want to contribute back to the upstream project.
 
 ## Troubleshooting
 
 
 1. CSS is missing! That means that you have wrongly set up the CSS URL in your
 
-   HTML files.
 
+   HTML files. Have a look at the [index.html] for an example.
 
 
 [ci]: https://about.gitlab.com/gitlab-ci/
 
+[index.html]: https://gitlab.com/pages/plain-html/blob/master/public/index.html
 
 [userpages]: http://doc.gitlab.com/ee/pages/README.html#user-or-group-pages
 
 [projpages]: http://doc.gitlab.com/ee/pages/README.html#project-pages

+ 7 - 0
public/index.html
View File 

@@ -4,8 +4,15 @@
 
     <meta charset="utf-8">
 
     <meta name="generator" content="GitLab Pages">
 
     <title>Plain HTML site using GitLab Pages</title>
 
+    <link rel="stylesheet" href="style.css">
 
   </head>
 
   <body>
 
+    <div class="navbar">
 
+      <a href="https://pages.gitlab.io/plain-html/">Plain HTML Example</a>
 
+      <a href="https://gitlab.com/pages/plain-html/">Repository</a>
 
+      <a href="https://gitlab.com/pages/">Other Examples</a>
 
+    </div>
 
+
 
     <h1>Hello World!</h1>
 
 
     <p>

+ 24 - 0
public/style.css
View File 

@@ -0,0 +1,24 @@
 
+body {
 
+  font-family: sans-serif;
 
+  margin: auto;
 
+  max-width: 1280px;
 
+}
 
+
 
+.navbar {
 
+  background-color: #313236;
 
+  border-radius: 2px;
 
+  max-width: 800px;
 
+}
 
+
 
+.navbar a {
 
+  color: #aaa;
 
+  display: inline-block;
 
+  font-size: 15px;
 
+  padding: 10px;
 
+  text-decoration: none;
 
+}
 
+
 
+.navbar a:hover {
 
+  color: #ffffff;
 
+}
 
+