diff --git a/about.html b/about.html index 9e345c2..12c8d7d 100644 --- a/about.html +++ b/about.html @@ -18,13 +18,18 @@ - + + @@ -41,9 +46,8 @@ @@ -56,7 +60,35 @@
- Lorem ipsum + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. +
+

Contact Me

+
+ +
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+
+ +
+
+
diff --git a/contact.html b/buy.html similarity index 66% rename from contact.html rename to buy.html index a6612b5..5b0825c 100644 --- a/contact.html +++ b/buy.html @@ -1,101 +1,75 @@ - - - - - - - - - Nancy Pannikkat - - - - - - - - - - - - - - - - - -
- -
-
-
-

Contact Me

-
- -
-
-
- - -
-
-
-
- - -
-
-
-
- - -
-
-
- -
-
-
-
- - + + + + + + + + + Nancy Pannikkat + + + + + + + + + + + + + + + +
+ +
+
+ +
+ + \ No newline at end of file diff --git a/css/general.css b/css/general.css index 29312fd..835a6a7 100644 --- a/css/general.css +++ b/css/general.css @@ -5,6 +5,10 @@ html { scroll-behavior: smooth; } +body { + padding-top: 100px; +} + * { margin: 0; padding: 0; @@ -111,102 +115,32 @@ nav ul li { display: inline-flex; } -body { - padding-top: 100px; -} - -.gallery-parent { - display: flex; - flex-wrap: wrap; - width: auto; - padding-top: 20px; - max-width: 1300px; - - /* Change later */ - margin: auto; +main { + width: 100%; justify-content: center; -} - -.gallery-article { - width: auto; - height: auto; - /* background-color: darkgray; */ - margin: 10px 50px 50px; -} - -.art-thumbnail { - width: 250px; - height: 250px; - background: linear-gradient(rgba(10, 14, 18, 0.2) 50%, rgba(104, 104, 104, 0.37) 60%, rgb(188, 188, 188) 100%); -} - -.art-title { - font-size: 20px; - padding: 5px 0; -} - -.art-desc { - font-size: 18px; - color: darkgray; + align-items: center; + position: relative; + margin: auto; + padding-top: 30px; } header { margin: auto; width: 100%; height: auto; - background-color: aliceblue; padding: 30px 0; } -.showcase-parent { - display: flex; - justify-content: space-between; - align-items: center; - text-align: center; - padding: 0 30px; +.splide__slide { + padding: 0 10px; +} + +.slide-content { max-width: 800px; - min-width: 300px; - margin: auto; } -.header-text { - display: flex; - flex-flow: column nowrap; - position: relative; - padding: 10px 20px; - max-width: 700px; - min-width: 300px; -} - -.header-title { - padding: 10px 0; -} - -.header-subtitle { - font-size: 18px; -} - -.header-button { - width: 120px; - margin: 30px auto 0; - border-radius: 3px; - box-shadow: 1px 1px 2px 2px rgb(201, 201, 201); - padding: 10px 20px; - background-color: rgb(169, 193, 169) ; -} - -.header-link { - text-decoration: none; - color: unset; -} - -.header-thumbnail { - height: 300px; - width: 300px; - background-color: bisque; - box-shadow: 0px 3px 5px 5px rgb(201, 201, 201); - margin: 20px; - align-items: center; +.slide-img { + width: 100%; } .about-parent { @@ -215,7 +149,9 @@ header { height: auto; margin: 20px auto; max-width: 1000px; + min-width: 200px; justify-content: center; + padding: 0 20px; } .about-img { @@ -231,10 +167,27 @@ header { } /* Contact */ +.contact { + text-align: center; + max-width: 1500px; + margin: 50px 0; +} + +.topic { + font-size: 30px; +} + +.line { + margin: 10px 0 0; +} + .contact-form { margin-top: 30px; min-width: 300px; - width: 40vw; + width: 100%; + + padding-bottom: 20px; + margin: 30px auto; } input:-webkit-autofill, @@ -251,7 +204,7 @@ input:-webkit-autofill:active { } .input-block { - background-color: #bababa; + background-color: #dddddd; border-radius: 2px; width: 100%; height: 60px; @@ -262,7 +215,7 @@ input:-webkit-autofill:active { color: black; } .input-block.focus { - background-color: #d1d6df; + filter: brightness(0.9); transition: 0.5s; } .input-block.textarea { @@ -306,8 +259,8 @@ option { top: 0; } .square-button { - background-color: rgb(180, 180, 180); - color: #060047; + background-color: #dddddd; + color: #2c2c2c; font-size: 26px; text-transform: uppercase; font-weight: 700; @@ -319,7 +272,7 @@ option { width: 30%; } .square-button:hover, .square-button:focus { - filter: brightness(0.8); + filter: brightness(0.9); cursor: pointer; } @@ -330,25 +283,6 @@ option { } } -main { - width: 100%; - justify-content: center; - align-items: center; - position: relative; - margin: auto; - display: flex; - padding-top: 30px; -} - -.contact { - text-align: center; - max-width: 1500px; -} - -.topic { - font-size: 30px; -} - /* Footer */ footer { width: 100%; @@ -359,8 +293,9 @@ footer { display: flex; justify-content: space-between; max-width: 800px; - min-width: none; + min-width: 200px; margin: auto; + padding: 0 20px; } .footer-copyright { diff --git a/css/splide.min.css b/css/splide.min.css new file mode 100644 index 0000000..7e014b4 --- /dev/null +++ b/css/splide.min.css @@ -0,0 +1 @@ +.splide__container{box-sizing:border-box;position:relative}.splide__list{backface-visibility:hidden;display:-ms-flexbox;display:flex;height:100%;margin:0!important;padding:0!important}.splide.is-initialized:not(.is-active) .splide__list{display:block}.splide__pagination{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:center;justify-content:center;margin:0;pointer-events:none}.splide__pagination li{display:inline-block;line-height:1;list-style-type:none;margin:0;pointer-events:auto}.splide:not(.is-overflow) .splide__pagination{display:none}.splide__progress__bar{width:0}.splide{position:relative;visibility:hidden}.splide.is-initialized,.splide.is-rendered{visibility:visible}.splide__slide{backface-visibility:hidden;box-sizing:border-box;-ms-flex-negative:0;flex-shrink:0;list-style-type:none!important;margin:0;position:relative}.splide__slide img{vertical-align:bottom}.splide__spinner{animation:splide-loading 1s linear infinite;border:2px solid #999;border-left-color:transparent;border-radius:50%;bottom:0;contain:strict;display:inline-block;height:20px;left:0;margin:auto;position:absolute;right:0;top:0;width:20px}.splide__sr{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.splide__toggle.is-active .splide__toggle__play,.splide__toggle__pause{display:none}.splide__toggle.is-active .splide__toggle__pause{display:inline}.splide__track{overflow:hidden;position:relative;z-index:0}@keyframes splide-loading{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.splide__track--draggable{-webkit-touch-callout:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}.splide__track--fade>.splide__list>.splide__slide{margin:0!important;opacity:0;z-index:0}.splide__track--fade>.splide__list>.splide__slide.is-active{opacity:1;z-index:1}.splide--rtl{direction:rtl}.splide__track--ttb>.splide__list{display:block}.splide__arrow{-ms-flex-align:center;align-items:center;background:#ccc;border:0;border-radius:50%;cursor:pointer;display:-ms-flexbox;display:flex;height:2em;-ms-flex-pack:center;justify-content:center;opacity:.7;padding:0;position:absolute;top:50%;transform:translateY(-50%);width:2em;z-index:1}.splide__arrow svg{fill:#000;height:1.2em;width:1.2em}.splide__arrow:hover:not(:disabled){opacity:.9}.splide__arrow:disabled{opacity:.3}.splide__arrow:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide__arrow--prev{left:1em}.splide__arrow--prev svg{transform:scaleX(-1)}.splide__arrow--next{right:1em}.splide.is-focus-in .splide__arrow:focus{outline:3px solid #0bf;outline-offset:3px}.splide__pagination{bottom:.5em;left:0;padding:0 1em;position:absolute;right:0;z-index:1}.splide__pagination__page{background:#ccc;border:0;border-radius:50%;display:inline-block;height:8px;margin:3px;opacity:.7;padding:0;position:relative;transition:transform .2s linear;width:8px}.splide__pagination__page.is-active{background:#fff;transform:scale(1.4);z-index:1}.splide__pagination__page:hover{cursor:pointer;opacity:.9}.splide__pagination__page:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide.is-focus-in .splide__pagination__page:focus{outline:3px solid #0bf;outline-offset:3px}.splide__progress__bar{background:#ccc;height:3px}.splide__slide{-webkit-tap-highlight-color:rgba(0,0,0,0)}.splide__slide:focus{outline:0}@supports(outline-offset:-3px){.splide__slide:focus-visible{outline:3px solid #0bf;outline-offset:-3px}}@media screen and (-ms-high-contrast:none){.splide__slide:focus-visible{border:3px solid #0bf}}@supports(outline-offset:-3px){.splide.is-focus-in .splide__slide:focus{outline:3px solid #0bf;outline-offset:-3px}}@media screen and (-ms-high-contrast:none){.splide.is-focus-in .splide__slide:focus{border:3px solid #0bf}.splide.is-focus-in .splide__track>.splide__list>.splide__slide:focus{border-color:#0bf}}.splide__toggle{cursor:pointer}.splide__toggle:focus-visible{outline:3px solid #0bf;outline-offset:3px}.splide.is-focus-in .splide__toggle:focus{outline:3px solid #0bf;outline-offset:3px}.splide__track--nav>.splide__list>.splide__slide{border:3px solid transparent;cursor:pointer}.splide__track--nav>.splide__list>.splide__slide.is-active{border:3px solid #000}.splide__arrows--rtl .splide__arrow--prev{left:auto;right:1em}.splide__arrows--rtl .splide__arrow--prev svg{transform:scaleX(1)}.splide__arrows--rtl .splide__arrow--next{left:1em;right:auto}.splide__arrows--rtl .splide__arrow--next svg{transform:scaleX(-1)}.splide__arrows--ttb .splide__arrow{left:50%;transform:translate(-50%)}.splide__arrows--ttb .splide__arrow--prev{top:1em}.splide__arrows--ttb .splide__arrow--prev svg{transform:rotate(-90deg)}.splide__arrows--ttb .splide__arrow--next{bottom:1em;top:auto}.splide__arrows--ttb .splide__arrow--next svg{transform:rotate(90deg)}.splide__pagination--ttb{bottom:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;left:auto;padding:1em 0;right:.5em;top:0} \ No newline at end of file diff --git a/font/Queensides-3z7Ey.ttf b/font/Queensides-3z7Ey.ttf new file mode 100644 index 0000000..7702be7 Binary files /dev/null and b/font/Queensides-3z7Ey.ttf differ diff --git a/font/QueensidesLight-ZVj3l.ttf b/font/QueensidesLight-ZVj3l.ttf new file mode 100644 index 0000000..d248c35 Binary files /dev/null and b/font/QueensidesLight-ZVj3l.ttf differ diff --git a/gallery.html b/gallery.html deleted file mode 100644 index f3870cf..0000000 --- a/gallery.html +++ /dev/null @@ -1,130 +0,0 @@ - - - - - - - - - Nancy Pannikkat - - - - - - - - - - - - - - - - -
- -
- - -
-
-
-
-
Title
-
-
Price
-
-
-
-
Title
-
-
Price
-
-
-
-
Title
-
-
Price
-
-
-
-
Title
-
-
Price
-
-
-
-
Title
-
-
Price
-
-
-
-
Title
-
-
Price
-
-
-
-
Title
-
-
Price
-
-
-
-
Title
-
-
Price
-
-
-
-
Title
-
-
Price
-
-
-
- - - \ No newline at end of file diff --git a/img/piece-1.jpg b/img/piece-1.jpg new file mode 100644 index 0000000..8fd489f Binary files /dev/null and b/img/piece-1.jpg differ diff --git a/index.html b/index.html index 175b58b..30754dc 100644 --- a/index.html +++ b/index.html @@ -10,6 +10,7 @@ Nancy Pannikkat + @@ -18,13 +19,18 @@ - + + @@ -41,9 +47,8 @@ @@ -51,23 +56,22 @@
-
-
- Collection 2022 -

Title

-

modern art

-
Learn More
 +
+
+
    +
    • +
    • +
    • +
-
-
+
-