diff --git a/electron/main/index.html b/electron/main/index.html index 7498d42..fa684c1 100644 --- a/electron/main/index.html +++ b/electron/main/index.html @@ -9,6 +9,22 @@
+
+ +
+

Video to document

diff --git a/electron/main/style.css b/electron/main/style.css index 35ddb79..913378b 100644 --- a/electron/main/style.css +++ b/electron/main/style.css @@ -10,17 +10,27 @@ body { margin: 0; } +#h1 { + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + margin: 0; + z-index: 20; + +} + #h1-wrapper { +position: relative; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; - display: flex; - padding-bottom: 25px; width: 770px; - height: 50px; + height: 60px; background-color: #FFF; box-shadow: 0px 4px 10px rgba(0,0,0,0.1); border-radius: 5px; - justify-content: center; margin-bottom: 10px; + display: flex; + align-items: center; } .upload-container { @@ -299,4 +309,107 @@ gap: 5px; border: 1px solid black; margin: 5px; border-radius: 100px; +} + +li { + color: #FFF; +} + +.p-menu1 { + margin-left: 20px; + z-index: 10; +} + +.hamburger1 { + height: 45px; + margin: 0; + padding-top: 8px; + display: grid; + grid-template-rows: repeat(3, 1fr); + justify-items: center; + z-index: 120; +} + +.hamburger1 div { + background-color: rgb(61, 61, 61); + position: relative; + width: 40px; + height: 5px; + margin-top: 0; + -webkit-transition: all 0.2s ease-in-out; + transition: all 0.2s ease-in-out; +} + +#toggle1 { + display: none; +} + +#toggle1:checked + .hamburger1 .top { + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + margin-top: 22.5px; +} + +#toggle1:checked + .hamburger1 .meat { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); + margin-top: -5px; +} + +#toggle1:checked + .hamburger1 .bottom { + -webkit-transform: scale(0); + transform: scale(0); +} + +#toggle1:checked ~ .menu1 { + height: 150px; + width: 300px; +} + +/* Menu */ +.menu1 { + position: absolute; + top: 55px; + left: 20px; + width: 240px; + border-radius: 5px; + background-color: #1C3B69; + margin: 0; + display: -ms-grid; + display: grid; + grid-template-rows: 1fr repeat(4, 0.5fr); + grid-row-gap: 25px; + padding: 0; + list-style: none; + clear: both; + width: auto; + text-align: center; + height: 0px; + overflow: hidden; + transition: height 0.3s ease, width 0.3s ease; + z-index: 9999; + -webkit-transition: all 0.3s ease; +} + +.menu1 li:first-child { + margin-top: 30px; +} + +.menu1 li:last-child { + margin-bottom: 30px; +} + +.li1 { + width: 100%; + margin: 0; + padding: 10px 0; + font: 700 20px 'Oswald', sans-serif; +} + +.li1:hover { + background-color: #FFF; + color: rgb(61, 61, 61); + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + -webkit-transition: all 0.3s ease; + transition: all 0.3s ease; } \ No newline at end of file