+ 6
- 1
web/app/static/styles/custom.css
파일 보기
| @@ -9,11 +9,16 @@ | |||
| # Bootstrap 5.1.3: https://getbootstrap.com/ | |||
| */ | |||
| body { | |||
| font-family: 'Lato', sans-serif !important; | |||
| } | |||
| main > .container { | |||
| padding: 60px 15px 0; | |||
| } | |||
| .carousel-control-next, | |||
| .carousel-control-prev { | |||
| .carousel-control-prev, | |||
| .carousel-indicators { | |||
| filter: invert(100%); | |||
| } | |||
+ 2
- 0
web/app/templates/base.html
파일 보기
| @@ -23,6 +23,8 @@ | |||
| <!-- Bootstrap CSS --> | |||
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> | |||
| <link href="{{ url_for('static',filename='styles/custom.css') }}" rel="stylesheet"> | |||
| <!-- Google font --> | |||
| <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700&display=swap" rel='stylesheet' type='text/css'> | |||
| </head> | |||
| <body class="d-flex flex-column h-100"> | |||
+ 12
- 3
web/app/templates/index.html
파일 보기
| @@ -21,13 +21,22 @@ | |||
| <!-- The slideshow/carousel --> | |||
| <div class="carousel-inner"> | |||
| <div class="carousel-item active text-center"> | |||
| Tool 1 | |||
| <h2>Tool 1</h2> | |||
| <p> | |||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus varius, justo a iaculis porta, ipsum nibh suscipit orci, at lobortis quam orci ac orci. In non consectetur ipsum. Suspendisse sodales tempor ullamcorper. | |||
| </p> | |||
| </div> | |||
| <div class="carousel-item text-center"> | |||
| Tool 2 | |||
| <h2>Tool 2</h2> | |||
| <p> | |||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus varius, justo a iaculis porta, ipsum nibh suscipit orci, at lobortis quam orci ac orci. In non consectetur ipsum. Suspendisse sodales tempor ullamcorper. | |||
| </p> | |||
| </div> | |||
| <div class="carousel-item text-center"> | |||
| Tool 3 | |||
| <h2>Tool 3</h2> | |||
| <p> | |||
| Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus varius, justo a iaculis porta, ipsum nibh suscipit orci, at lobortis quam orci ac orci. In non consectetur ipsum. Suspendisse sodales tempor ullamcorper. | |||
| </p> | |||
| </div> | |||
| </div> | |||
Loading…