Browse Source

CSS convertido para LESS

master
Eduardo Velasques 3 years ago
parent
commit
bae0816dbf
20 changed files with 89 additions and 61 deletions
  1. +2
    -1
      contact.html
  2. +3
    -1
      index.html
  3. +2
    -1
      projects.html
  4. +11
    -0
      scripts/less.min.js
  5. +1
    -0
      scripts/less.min.js.map
  6. +11
    -0
      scripts/main.js
  7. +0
    -0
      styles/_base.less
  8. +0
    -0
      styles/_footer.less
  9. +3
    -1
      styles/_header.less
  10. +0
    -0
      styles/_main.less
  11. +3
    -4
      styles/blocks/_banner.less
  12. +0
    -38
      styles/blocks/_form.css
  13. +36
    -0
      styles/blocks/_form.less
  14. +0
    -3
      styles/blocks/_section.css
  15. +5
    -0
      styles/blocks/_section.less
  16. +0
    -0
      styles/blocks/_table.less
  17. +0
    -5
      styles/blocks/root.css
  18. +5
    -0
      styles/blocks/root.less
  19. +0
    -7
      styles/root.css
  20. +7
    -0
      styles/root.less

+ 2
- 1
contact.html View File

@ -3,7 +3,8 @@
<head>
<title>Trit&atilde;o</title>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="stylesheet" href="/styles/root.css"/>
<link rel="stylesheet/less" href="/styles/root.less"/>
<script src="scripts/less.min.js" type="text/javascript"></script>
</head>
<body>
<header>


+ 3
- 1
index.html View File

@ -3,7 +3,8 @@
<head>
<title>Trit&atilde;o</title>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="stylesheet" href="/styles/root.css"/>
<link rel="stylesheet/less" href="/styles/root.less"/>
<script src="scripts/less.min.js" type="text/javascript"></script>
</head>
<body>
<header>
@ -49,5 +50,6 @@
<footer>
&copy; 2023 Trit&atilde;o
</footer>
<script src="scripts/main.js"></script>
</body>
</html>

+ 2
- 1
projects.html View File

@ -3,7 +3,8 @@
<head>
<title>Trit&atilde;o</title>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<link rel="stylesheet" href="/styles/root.css"/>
<link rel="stylesheet/less" href="/styles/root.less"/>
<script src="scripts/less.min.js" type="text/javascript"></script>
</head>
<body>
<header>


+ 11
- 0
scripts/less.min.js
File diff suppressed because it is too large
View File


+ 1
- 0
scripts/less.min.js.map
File diff suppressed because it is too large
View File


+ 11
- 0
scripts/main.js View File

@ -0,0 +1,11 @@
//alert('Ola do JavaScript');
/**
console.warn('Alerta de teste...');
console.error('Aconteceu um erro!');
console.log('Mensagem de log geral...');
*/
const logo = document.querySelector('div.logo');
logo.style.border = '2px solid yellow';

styles/_base.css → styles/_base.less View File


styles/_footer.css → styles/_footer.less View File


styles/_header.css → styles/_header.less View File


styles/_main.css → styles/_main.less View File


styles/blocks/_banner.css → styles/blocks/_banner.less View File


+ 0
- 38
styles/blocks/_form.css View File

@ -1,38 +0,0 @@
form > div {
margin-bottom: 20px;
}
form > div > label {
display: block;
}
form > div > div {
margin-top: 5px;
}
form input, form textarea {
border: 2px solid #12A89D;
padding: 10px;
border-radius: 5px;
min-width: 250px;
background-color: #d1f9e9;
}
form button {
color: #FFFFFF;
border: none;
background-color: #12A89D;
padding: 10px;
border-radius: 5px;
cursor: pointer;
}
form button:hover {
transition: 0.5s ease-in;
color: #d1f9e9;
background-color: #222222;
box-shadow: 0 0 10px 5px #12A89D;
}

+ 36
- 0
styles/blocks/_form.less View File

@ -0,0 +1,36 @@
form {
> div {
margin-bottom: 20px;
> label {
display: block;
}
> div {
margin-top: 5px;
}
}
input, textarea {
border: 2px solid #12A89D;
padding: 10px;
border-radius: 5px;
min-width: 250px;
background-color: #d1f9e9;
}
button {
color: #FFFFFF;
border: none;
background-color: #12A89D;
padding: 10px;
border-radius: 5px;
cursor: pointer;
&:hover {
transition: 0.5s ease-in;
color: #d1f9e9;
background-color: #222222;
box-shadow: 0 0 10px 5px #12A89D;
}
}
}

+ 0
- 3
styles/blocks/_section.css View File

@ -1,3 +0,0 @@
section h1, section h3 {
color: #12A89D;
}

+ 5
- 0
styles/blocks/_section.less View File

@ -0,0 +1,5 @@
section {
h1, h3 {
color: #12A89D;
}
}

styles/blocks/_table.css → styles/blocks/_table.less View File


+ 0
- 5
styles/blocks/root.css View File

@ -1,5 +0,0 @@
@import "_banner.css";
@import "_section.css";
@import "_table.css";
@import "_form.css";

+ 5
- 0
styles/blocks/root.less View File

@ -0,0 +1,5 @@
@import "./_banner.less";
@import "./_section.less";
@import "./_table.less";
@import "./_form.less";

+ 0
- 7
styles/root.css View File

@ -1,7 +0,0 @@
@import "_base.css";
@import "_header.css";
@import "_main.css";
@import "_footer.css";
@import "blocks/root.css";

+ 7
- 0
styles/root.less View File

@ -0,0 +1,7 @@
@import "./_base.less";
@import "./_header.less";
@import "./_main.less";
@import "./_footer.less";
@import "./blocks/root.less";

Loading…
Cancel
Save