diff options
| author | Mateja <mail@matejamaric.com> | 2021-05-02 21:06:06 +0200 |
|---|---|---|
| committer | Mateja <mail@matejamaric.com> | 2021-05-02 21:06:06 +0200 |
| commit | 7483bb5da6b22b94045a309d2ece2ed80ce48dc2 (patch) | |
| tree | 2bcdb9c0e395ab967302fc1409b205f75b0a4f13 | |
| parent | 4320439bb76922c13917845a2dcb17a84fc493d2 (diff) | |
| download | node-playground-7483bb5da6b22b94045a309d2ece2ed80ce48dc2.tar.gz node-playground-7483bb5da6b22b94045a309d2ece2ed80ce48dc2.zip | |
Add `public` directory for static files.
| -rw-r--r-- | index.js | 2 | ||||
| -rw-r--r-- | public/css/style.css | 77 | ||||
| -rw-r--r-- | views/layouts/main.handlebars | 5 |
3 files changed, 83 insertions, 1 deletions
@@ -6,6 +6,8 @@ const app = express(); app.engine('handlebars', exphbs()); app.set('view engine', 'handlebars'); +app.use(express.static('public')); + app.get('/', (req, res) => { res.render('home', { title: 'Home Page', diff --git a/public/css/style.css b/public/css/style.css new file mode 100644 index 0000000..d3a017d --- /dev/null +++ b/public/css/style.css @@ -0,0 +1,77 @@ +body { + font-family: 'Lato', sans-serif; + background: #cbd4ee; } + +footer, nav { + background: linear-gradient(to right, #3c1d43, #002147) !important; + color: white; + font-size: 1.1rem !important; } + footer .nav-item, nav .nav-item { + padding: 0.7rem; } + +.carousel { + max-height: 60vh; + overflow: hidden; } + .carousel .img-fluid { + width: 100%; } + +.badge { + background: #002147; + padding: 1rem; + border-radius: 0 35%; } + +.btn { + background: #002147; + color: white; } + .btn:hover { + color: #cbd4ee; } + +.card { + height: 100%; } + .card .card-title { + font-weight: bold; } + .card .card-header { + background: #3c1d43; + color: white; } + .card .card-footer { + background: #002147; + color: white; } + .card .img-fluid { + width: 100%; + height: 100%; } + +.repertory { + width: 55rem; } + +.soon { + height: auto; } + +.icons-index { + font-size: 10rem; + color: #002147; + opacity: 0.7; } + +.gallery-container { + max-width: 80vw; + max-height: 75vh; } + .gallery-container .gallery-image { + width: 100%; + height: 100%; + object-fit: cover; } + +.gallery-image-thumbnail { + width: 100%; + height: 100%; + opacity: 0.7; } + .gallery-image-thumbnail:hover { + cursor: pointer; } + +.selected { + opacity: 1; } + +.column { + float: left; + width: 16.66%; } + +.form-text { + color: #002147; } diff --git a/views/layouts/main.handlebars b/views/layouts/main.handlebars index c41b99f..9eccc37 100644 --- a/views/layouts/main.handlebars +++ b/views/layouts/main.handlebars @@ -5,9 +5,12 @@ <meta name="viewport" content="width=device-width" /> <title>{{ title }}</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous"> + <link rel="preconnect" href="https://fonts.gstatic.com"> + <link href="https://fonts.googleapis.com/css2?family=Lato:wght@400&display=swap" rel="stylesheet"> + <link rel="stylesheet" href="/css/style.css"> </head> <body> - <nav class="navbar navbar-expand-lg navbar-light bg-light"> + <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> <div class="container-fluid"> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> |