From 0a371cb3550b48c641764b440e50cb77081b591b Mon Sep 17 00:00:00 2001 From: Brunna Date: Fri, 8 Mar 2024 00:32:53 -0300 Subject: [PATCH] Primeiros testes --- Temporario/Rascunho.css | 98 +++++++++++++++++++++++++++++ Temporario/Rascunho.html | 56 +++++++++++++++++ index.js => Temporario/index.js | 2 +- index.css | 15 +++++ index.html | 106 +++++++++++++++++--------------- 5 files changed, 226 insertions(+), 51 deletions(-) create mode 100644 Temporario/Rascunho.css create mode 100644 Temporario/Rascunho.html rename index.js => Temporario/index.js (99%) diff --git a/Temporario/Rascunho.css b/Temporario/Rascunho.css new file mode 100644 index 0000000..be110e2 --- /dev/null +++ b/Temporario/Rascunho.css @@ -0,0 +1,98 @@ +*{ + border: none; + margin: 0px; + padding: 0px; + box-sizing: border-box; +} +.divBase{ + display: flex; + align-items: flex-start; + justify-content: flex-start; + flex-direction: column; + width: 100%; + height: 100vh; +} +.divHead{ + display: flex; + align-items: flex-start; + justify-content: column; + width: 100%; + background-color: rgb(97, 110, 226); +} +.divParte1{ + display: flex; + align-items: flex-start; + justify-content: column; + width: 100%; + background-color: red; +} +.divGrupo1{ + display: flex; + align-items: flex-start; + justify-content: column; + flex-direction: row; + width: 100%; +} +.divParte2E{ + display: flex; + align-items: flex-start; + justify-content: column; + flex-direction: column; + width: 50%; + background-color: blue; + padding: 0 20px 0 20px; +} +.h1TextAera{ + display: flex; + width: 100%; + height: 500px; +} +.divParte2D{ + display: flex; + align-items: flex-start; + justify-content: column; + flex-direction: column; + width: 50%; + background-color: rgb(0, 255, 34); + padding: 0 20px 0 20px; +} +.h2TextAera{ + display: flex; + width: 100%; + height: 500px; +} +.divBotoes{ + display: flex; + align-items: flex-start; + justify-content: column; + background-color: aquamarine; + width: 100%; +} +.divDbGrid{ + display: flex; + align-items: flex-start; + justify-content: column; + background-color: rgb(255, 255, 255); + width: 100%; +} +.divConteudo{ + display: flex; + align-items: flex-start; + justify-content: column; + background-color: rgb(213, 228, 130); + width: 100%; +} +.styBtn{ + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + border-radius: 5px; + cursor: pointer; + padding: 5px; + width: 100px; + background-color: #248; + color: white; + border: 1px solid; + border-color: #999 #000 #000 #999; +} \ No newline at end of file diff --git a/Temporario/Rascunho.html b/Temporario/Rascunho.html new file mode 100644 index 0000000..2e6569a --- /dev/null +++ b/Temporario/Rascunho.html @@ -0,0 +1,56 @@ + + + + + + + + + + Data Grid + + + +
+
+

Head de página

+
+
+

Teste de página

+
+
+
+

Esquerda

+ +
+
+

Direita

+ +
+
+
+

Botões

+ + + +
+
+

Grid

+
+
+

Conteúdo

+ 
+                
+
+                
+                
+
+
+
+ + + \ No newline at end of file diff --git a/index.js b/Temporario/index.js similarity index 99% rename from index.js rename to Temporario/index.js index d5f8249..80a28e5 100644 --- a/index.js +++ b/Temporario/index.js @@ -1,4 +1,4 @@ -import { DataGrid } from "./src/dataGrid.js"; +import { DataGrid } from "../src/dataGrid.js"; const divBase = document.querySelector('#divBase') const divHead = document.querySelector('#divHead') const divParte1 = document.querySelector('#divParte1') diff --git a/index.css b/index.css index be110e2..1fa8a99 100644 --- a/index.css +++ b/index.css @@ -4,6 +4,21 @@ padding: 0px; box-sizing: border-box; } +h1 +{ + font-family: "Inter", sans-serif; + font-size: 40px; + font-weight: 600; +} + +h2 +{ + font-family: "Inter", sans-serif; + font-size: 16px; + font-weight: 500; +} + + .divBase{ display: flex; align-items: flex-start; diff --git a/index.html b/index.html index 22f7442..497edeb 100644 --- a/index.html +++ b/index.html @@ -1,56 +1,62 @@ - - + + - - - - - - - Data Grid - + + + + + + + Data Grid + + + + -
-
-

Head de página

-
-
-

Teste de página

-
-
-
-

Esquerda

- -
-
-

Direita

- -
-
-
-

Botões

- - - -
-
-

Grid

-
-
-

Conteúdo

- 
-                
-
-                
+    

+    

+        

+            
DataGrid

+            
Lorem ipsum dolor sit amet consectetur adipisicing elit. Eaque culpa repellendus, temporibus quo quidem blanditiis maxime iste fugit! Deleniti, ab voluptatibus voluptatum corporis quibusdam vitae soluta expedita mollitia assumenda deserunt?

+            
Value

+            
A string

+            
Its value is determined as follows:

+            
    
+                
  • Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam tempora, exercitationem laudantium non, quibusdam id atque reiciendis odit earum iste distin
    • 
+                
  • Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam tempora, exercitationem laudantium non, quibusdam id atque reiciendis odit earum iste distin
    • 
+                
  • Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam tempora, exercitationem laudantium non, quibusdam id atque reiciendis odit earum iste distin
    • 
+                
  • Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam tempora, exercitationem laudantium non, quibusdam id atque reiciendis odit earum iste distin
    • 
+                
  • Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam tempora, exercitationem laudantium non, quibusdam id atque reiciendis odit earum iste distin
    • 
+            

+            See a full list of key values.
+            

+                

+                    

+                        
Esquerda

+                                        
+                    

+                    

+                        
Direita

+                        
+                    

+                

+                

+                    
Botões

+                    
+                    
+                    
+                

                 
-
-
-
+ + + + + - + \ No newline at end of file