From 4b9f65632b9a9251f48bc90ab1f00609bd32fc6f Mon Sep 17 00:00:00 2001 From: Mikitl Date: Sun, 8 Sep 2024 00:06:10 -0600 Subject: [PATCH] =?UTF-8?q?Avance=20dise=C3=B1o=20desktop?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- conoce-la-fes/assets/css/conoce-la-fes.css | 179 ++----------------- conoce-la-fes/assets/css/conoce-la-fes.less | 55 ++++++ conoce-la-fes/assets/img/sorjuana.png | Bin 0 -> 346941 bytes conoce-la-fes/index.html | 180 ++++---------------- 4 files changed, 102 insertions(+), 312 deletions(-) create mode 100644 conoce-la-fes/assets/css/conoce-la-fes.less create mode 100644 conoce-la-fes/assets/img/sorjuana.png diff --git a/conoce-la-fes/assets/css/conoce-la-fes.css b/conoce-la-fes/assets/css/conoce-la-fes.css index c5033cf..774075f 100644 --- a/conoce-la-fes/assets/css/conoce-la-fes.css +++ b/conoce-la-fes/assets/css/conoce-la-fes.css @@ -1,195 +1,50 @@ /* ========== main ========== */ -#main { +main{ + color: #0000; +} +main h2{ + color: #1e3c70; +} +#hero { width: 100%; - background: url("../../../assets/img/bg/alt-1.jpg") fixed top center; + max-height: 80vh; + background: linear-gradient(rgba(38, 42, 93, 0.4), rgba(0, 0, 0, 0.7)), url("../../../assets/img/bg/solid.png") fixed center; background-size: cover; position: relative; } -.container-image-sorjuana { - width: 250px; - height: 250px; - background-size: cover; - background-position: center; - transform: rotate(45deg); - border-radius: 1.5rem; - position: relative; - left: -40px; - overflow: hidden; -} -.image-sorjuana { - width: 700px; - transform: rotate(270deg) translateX(-125px) translateY(-220px); - object-fit: cover; -} -#main:before { +#hero:before { content: ""; - background: rgba(255, 255, 255, 0.3); + background: rgba(255, 255, 255, 0.03); position: absolute; bottom: 0; top: 0; left: 0; right: 0; } -#main .container { - display: flex; - flex-direction: column; - align-items: center; - justify-content: space-between; - position: relative; - gap: 20px; -} -#main h1 { +#hero h1 { font-size: 36px; font-weight: 700; line-height: 40px; - color: #1e3c70; -} -.header { - margin-top: 15%; - display: flex; - justify-content: space-between; - align-items: center; - position: relative; -} -.header .title { - text-align: start; - padding-left: 10px; -} -.header .title h4 { color: darkgoldenrod; } -.information { - display: flex; - justify-content: center; - position: relative; - min-height: 100px; - background-color: white; - padding: 20px; - z-index: 10; -} -.floating-list { - position: absolute; - top: -30px; - margin: 0; - background-color: white; - color: black; - padding: 10px; - list-style: none; - display: flex; - gap: 10px; - justify-content: center; - border-radius: 8px; - max-width: 50%; - z-index: 9; -} -.floating-list li { - padding: 5px 10px; - display: flex; - align-items: center; -} -.historia { - border-radius: 1rem; - width: 90%; - background-color: #ffffff6b; - color: black; - text-align: left; - padding: 20px; -} -.juramento { - border-radius: 1rem; - width: 90%; - background-color: #ffffff6b; - color: black; - text-align: left; - padding: 20px; - margin-bottom: 20px; -} -.mision { - border-radius: 1rem; - width: 90%; - background-color: #ffffff6b; - color: black; - text-align: left; - padding: 20px; -} -.vision { - border-radius: 1rem; - width: 90%; - background-color: #ffffff6b; - color: black; - text-align: left; - padding: 20px; -} -.valores { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - position: relative; - min-height: 100px; - background-color: white; - color: black; - padding: 40px; - z-index: 10; -} -.ideario-institucional { - display: flex; - justify-content: center; - gap: 20px; - flex-wrap: wrap; -} -#ideario { - width: 100%; - background: url("../../../assets/img/bg/_DSC2981.jpg") fixed top center; - background-size: cover; - position: relative; - padding: 20px; -} -#ideario:before { - content: ""; - background: rgba(255, 255, 255, 0.3); - position: absolute; - bottom: 0; - top: 0; - left: 0; - right: 0; -} -.ideario-container { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - position: relative; - text-align: center; - gap: 20px; -} + @media (min-width: 1024px) { - #main { + #hero { background-attachment: fixed; } - .ideario-institucional { - flex-wrap: nowrap; - } } @media (max-width: 768px) { - #main { + #hero { height: 80vh; } - #main h1 { + #hero h1 { font-size: 28px; line-height: 36px; } - #main h2 { + #hero h2 { font-size: 20px; line-height: 24px; } - .container-image-sorjuana { - width: 200px; - height: 200px; - } - .image-sorjuana { - width: 500px; - } } diff --git a/conoce-la-fes/assets/css/conoce-la-fes.less b/conoce-la-fes/assets/css/conoce-la-fes.less new file mode 100644 index 0000000..3828c41 --- /dev/null +++ b/conoce-la-fes/assets/css/conoce-la-fes.less @@ -0,0 +1,55 @@ +/* Banner */ +.banner{ + overflow: visible; + + &-container{ + padding-top: 20vh; + } + + &-img{ + width: 25%; + height: 25%; + + border-radius: 2rem; + transform: rotate(-45deg); + + overflow: hidden; + + & img{ + width: 100%; + height: 100%; + object-fit: cover; + } + } +} + +/* Historia */ +.historia{ + h2{ + width: 40%; + border-bottom: 5px solid darkgoldenrod; + } + + &-info{ + gap: 10rem; + } + + &-imagenes{ + position: relative; + + #imgUno{ + max-width: 25vw; + min-height: 70vh; + object-fit: cover; + } + #imgDos{ + max-width: 20vw; + height: 30vh; + + object-fit: cover; + position: absolute; + left: -20%; + bottom: -15%; + } + } +} \ No newline at end of file diff --git a/conoce-la-fes/assets/img/sorjuana.png b/conoce-la-fes/assets/img/sorjuana.png new file mode 100644 index 0000000000000000000000000000000000000000..f6978452e49461988df90106abd723908db593fa GIT binary patch literal 346941 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