menu-update

master
Suvodip Ghosh 2023-02-25 21:03:59 +05:30
parent 42547a0999
commit c6191dbb10
17 changed files with 631 additions and 265 deletions

BIN
public/img/rgyci-img1.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

BIN
public/img/rgyci-img2.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

BIN
public/img/rgyci-img3.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

BIN
public/img/rgyci-img4.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
public/img/rgyci-img5.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

BIN
public/img/rgyci-img6.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

BIN
public/img/rgyci-img7.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
public/img/rgyci-img8.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

BIN
public/img/rgyci-img9.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

View File

@ -21,7 +21,7 @@
</div>
<div class="py-32 2xl:px-32" v-else>
<h2 class="text-2xl font-semibold py-4">Thanks for being awesome!</h2>
<p class="text-xl pb-32 text-justify px-8 w-full">We will back you Soon.[RGYCI].</p>
<p class="text-xl pb-32 text-justify px-8 w-full">We will back you Soon.</p>
</div>
</div>
</div>
@ -55,7 +55,7 @@ export default {
formData.append('Email', this.cuemail);
formData.append('MessageDetails', this.cumessage);
formData.append('formName', 'rgyci-contact-us');
fetch('https://api.teenybeans.in/API/contactFormProcessor/v1/',
fetch('',
{
method: 'POST',
body: formData,

View File

@ -9,7 +9,7 @@
<p class="flex inline-flex hover:text-yellow-400"><img class="" src="/img/svg/phone.svg" alt="">&nbsp;+91 7318992100;</p>
<p class="flex inline-flex hover:text-yellow-400 pr-10"><img src="/img/svg/mail.svg" alt="">&nbsp;ho@rgyci.org</p>
</div>
<div class="flex text-lg md:text-2xl pb-0 pr-10 justify-end"><button class="text-white hover:text-yellow-400">Login</button></div>
<!-- <div class="flex text-lg md:text-2xl pb-0 pr-10 justify-end"><button class="text-white hover:text-yellow-400">Login</button></div> -->
</div>
</section>
</main>

View File

@ -0,0 +1,86 @@
<template>
<swiper class="z-index"
:modules="modules"
:slides-per-view="1"
:space-between="50"
navigation
:pagination="{ clickable: true }"
:autoplay=" { delay: 2500, disableOnInteraction: true}"
@swiper="onSwiper"
@slideChange="onSlideChange"
>
<swiper-slide><img class="w-full" src="/img/sld/8.jpg" alt="" /></swiper-slide>
<swiper-slide><img class="w-full" src="/img/sld/1.jpg" alt="" /></swiper-slide>
<swiper-slide><img class="w-full" src="/img/sld/2.jpg" alt="" /></swiper-slide>
<swiper-slide><img class="w-full" src="/img/sld/3.jpg" alt="" /></swiper-slide>
<swiper-slide><img class="w-full" src="/img/sld/5.jpg" alt="" /></swiper-slide>
<swiper-slide><img class="w-full" src="/img/sld/6.jpg" alt="" /></swiper-slide>
<swiper-slide><img class="w-full" src="/img/sld/7.jpg" alt="" /></swiper-slide>
...
</swiper>
</template>
<style>
.z-index {
z-index: -1;
}
.text-color-1 {
color: #7C4C23;
font-family: 'Quicksand';
}
.slider-width {
width: 350px;
}
@media screen and (min-width: 1500px) {
.hero-text {
font-size: 50px;
}
}
@media screen and (max-width: 1499px) {
.hero-text {
font-size: 40px;
}
}
@media screen and (max-width: 1199px) {
.hero-text {
font-size: 30px;
}
}
</style>
<script>
// import Swiper core and required modules
import { Navigation, Pagination, Scrollbar, A11y, Autoplay, } from 'swiper';
// Import Swiper Vue.js components
import { Swiper, SwiperSlide } from 'swiper/vue';
// Import Swiper styles
import 'swiper/css';
import 'swiper/css/navigation';
import 'swiper/css/pagination';
import 'swiper/css/scrollbar';
export default {
components: {
Swiper,
SwiperSlide,
},
setup() {
const onSwiper = (swiper) => {
console.log(swiper);
};
const onSlideChange = () => {
console.log('slide change');
};
return {
onSwiper,
onSlideChange,
modules: [Navigation, Pagination, Scrollbar, A11y, Autoplay],
};
},
};
</script>

View File

@ -1,244 +1,276 @@
---
import Layout from "../layouts/Layout.astro";
import Online from "./Online.vue";
---
<Online/>
<main class="container-fluid navbar">
<!-- Desktop Menu -->
<div class="container mx-auto flex justify-center">
<div class="hidden md:block py-4">
<div class="navbar">
<a href="/">Home</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">About
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="/aboutus">About Us</a>
<a href="/chairman-message">Chairman Message</a>
<a href="/administrator">Adninistrator</a>
</div>
</div>
<a href="#news">Center List</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Courses
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="online-course">Online Courses</a>
<a href="#">Offline Courses</a>
</div>
</div>
<div class="dropdownDesktop ">
<button class="dropbtnDesktop">Student Zone
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop z-index">
<a href="https://center.rgyci.org/check_registration">Check Registration</a>
<a href="https://center.rgyci.org/checkresult">Result</a>
<a href="https://center.rgyci.org/chekcertificate">Certificate Verification</a>
<a href="https://center.rgyci.org/download">Download</a>
<a href="#">Online Exam</a>
<a href="https://center.rgyci.org/form/student_placement">Student's Placement Form</a>
<a href="/library">Library</a>
</div>
</div>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Franchise
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="https://center.rgyci.org/how-to-get-franchisee-with-rgyci">Procedure</a>
<a href="https://center.rgyci.org/form/franchise_enquiry">Enquiry</a>
<a href="https://center.rgyci.org/form/companies_placement">Company's Placement Form</a>
</div>
</div>
<a href="/gallery">Gallery</a>
<a href="contactus">Contact Us</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Login
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="https://center.rgyci.org/form/center_login">Center</a>
<a href="https://center.rgyci.org/form/teacher_login">Teacher</a>
</div>
</div>
</div>
</div>
</div>
<!-- Mobile Menu -->
<div class="mobileTopMenu block md:hidden">
<div class="topnavMobile">
<a href="#home" class="active">Logo</a>
<div id="mobileMenu" class="hidden">
<a href="#news">News</a>
<a href="#contact">Contact</a>
<div class="dropdown">
<button class="dropbtn">Dropdown
&#11183
</button>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2Link 2Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
<main>
<Online />
<section class="container-fluid" style="background-color: #962727;">
<div class="navbar shadow-xl zindex container mx-auto">
<!-- Navbar logo -->
<div class="nav-header">
<div class="nav-logo">
</div>
<a class="icon" onclick="openMobileMenu()">
&#9776;
</a>
</div>
<!-- responsive navbar toggle button -->
<input type="checkbox" id="nav-check">
<div class="nav-btn">
<label for="nav-check">
<span></span>
<span></span>
<span></span>
</label>
</div>
<!-- Navbar items -->
<div class="nav-links">
<a href="/">Home</a>
<div class="dropdown">
<a class="dropBtn" href="#">About
<i class="fas fa-angle-down"></i>
</a>
<div class="drop-content" >
<a href="/aboutus">About Us</a>
<a href="/chairman-message">Chairman Message</a>
<a href="/administrator">Adninistrator</a>
</div>
</div>
<a href="https://center.rgyci.org/center_list">Center List</a>
<!-- Dropdown menu -->
<div class="dropdown">
<a class="dropBtn" href="#">Courses
<i class="fas fa-angle-down"></i>
</a>
<div class="drop-content">
<a href="https://online.rgyci.org/login/index.php">Online Courses</a>
<a href="#">Offline Courses</a>
</div>
</div>
<div class="dropdown">
<a class="dropBtn" href="#">Student Zone
<i class="fas fa-angle-down"></i>
</a>
<div class="drop-content">
<a href="https://center.rgyci.org/check_registration">Check Registration</a>
<a href="https://center.rgyci.org/checkresult">Result</a>
<a href="https://center.rgyci.org/chekcertificate">Certificate Verification</a>
<a href="https://center.rgyci.org/download">Download</a>
<a href="http://center.rgyci.org/form/exam_center_login">Online Exam</a>
<a href="https://center.rgyci.org/form/student_placement">Student's Placement Form</a>
<a href="/library">Library</a>
</div>
</div>
<div class="dropdown">
<a class="dropBtn" href="#">Franchise
<i class="fas fa-angle-down"></i>
</a>
<div class="drop-content">
<a href="https://center.rgyci.org/how-to-get-franchisee-with-rgyci">Procedure</a>
<a href="https://center.rgyci.org/form/franchise_enquiry">Enquiry</a>
<a href="https://center.rgyci.org/form/companies_placement">Company's Placement Form</a>
</div>
</div>
<a href="/gallery">Gallery</a>
<a href="/contactus">Contact Us</a>
<div class="dropdown">
<a class="dropBtn" href="#">Login
<i class="fas fa-angle-down"></i>
</a>
<div class="drop-content">
<a href="https://center.rgyci.org/form/center_login">Center</a>
<a href="https://center.rgyci.org/form/teacher_login">Teacher</a>
</div>
</div>
</div>
</div>
</main>
<script is:inline>
function openMobileMenu() {
var element = document.getElementById("mobileMenu");
element.classList.toggle("hidden");
}
</script>
<style>
.z-index {
z-index: +10;
}
.navbar {
overflow: hidden;
background-color: rgb(150, 39, 39);
/* position: absolute;
width: 100%;
left: 0;
top: 0; */
</section>
</main>
<script is:inline>
</script>
<style>
.drop-content {
color: black;
width: fit-content;
}
.navbar a {
float: left;
font-size: 16px;
color: white;
.zindex {
z-index: 1;
}
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
body{
/* font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; */
background-image: url(background-img.jpg);
background-size: cover;
background-attachment: fixed;
}
.navbar{
height: 70px;
width: 100%;
padding: 25px 30px;
background-color: #962727;
position: relative;
}
.navbar .nav-header{
display: inline;
}
.navbar .nav-header .nav-logo{
display: inline-block;
margin-top: -7px;
}
.navbar .nav-links{
display: inline;
float: right;
font-size: 18px;
}
.navbar .nav-links .loginBtn{
display: inline-block;
padding: 5px 15px;
margin-left: 20px;
font-size: 17px;
color: rgb(255, 255, 255);
}
.navbar .nav-links a {
padding: 10px 12px;
width: fit-content;
text-decoration: none;
font-weight: 550;
color: white;
}
/* Hover effects */
.navbar .nav-links a:hover{
background-color: rgba(0, 0, 0, 0.3);
width: 100%;
border-radius: 10px;
}
/* responsive navbar toggle button */
.navbar #nav-check, .navbar .nav-btn{
display: none;
}
@media (max-width:970px) {
.navbar .nav-btn{
display: inline-block;
position: absolute;
top: 0px;
right: 0px;
}
.navbar .nav-btn label {
display: inline-block;
width: 80px;
height: 70px;
padding: 25px;
}
.navbar .nav-btn label span {
display: block;
height: 10px;
width: 25px;
border-top: 3px solid #eee;
}
.navbar .nav-btn label:hover, .navbar #nav-check:checked ~ .nav-btn label {
background-color: rgb(9, 14, 90);
transition: all 0.5s ease;
}
.navbar .nav-links{
position: absolute;
display: block;
text-align: center;
padding: 14px 16px;
text-decoration: none;
width: 100%;
background-color: rgb(9, 14, 90);
transition: all 0.3s ease-in;
overflow-y: hidden;
top: 70px;
right: 0px;
}
.dropdownDesktop {
float: left;
overflow: hidden;
.navbar .nav-links a {
display: block;
}
.dropdownDesktop .dropbtnDesktop {
font-size: 16px;
border: none;
outline: none;
color: white;
padding: 14px 16px;
background-color: inherit;
font-family: inherit;
margin: 0;
/* when nav toggle button not checked */
.navbar #nav-check:not(:checked) ~ .nav-links {
height: 0px;
}
.navbar a:hover, .dropdownDesktop:hover .dropbtnDesktop {
background-color: red;
/* when nav toggle button is checked */
.navbar #nav-check:checked ~ .nav-links {
height: fit-content;
overflow-y: auto;
}
.dropdown-contentDesktop {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
.navbar .nav-links .loginBtn {
padding: 10px 40px ;
margin: 20px;
font-size: 18px;
font-weight: bold;
color: rgb(9, 14, 90);
}
.dropdown-contentDesktop a {
/* Responsive dropdown code */
.navbar .nav-links .dropdown, .navbar .nav-links .dropdown2 {
float: none;
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
width: 100%;
}
.dropdown-contentDesktop a:hover {
background-color: #ddd;
}
.dropdownDesktop:hover .dropdown-contentDesktop {
display: block;
}
/* .mobileTopMenu{
position: absolute;
top:0;
left:0;
width:100%;
} */
.dropdown:hover .dropdown-content {
display: block;
background-color: #ddd;
}
.dropdown-content a:hover {
background-color: #ddd;
}
.dropdown-content {
display: none;
position: absolute;
z-index: 1;
}
.dropdown-content a {
float: none;
text-decoration: none;
display: block;
text-align: left;
}
.topnavMobile {
overflow: hidden;
background-color: #333;
.navbar .nav-links .drop-content, .navbar .nav-links .drop-content2 {
position: relative;
background-color: rgb(220, 220, 250);
top: 0px;
left: 0px;
}
.topnavMobile a, .topnavMobile >div > div {
color: white;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
display: block;
}
.topnavMobile a.icon {
background: black;
display: block;
position: absolute;
right: 0;
top: 0;
}
.topnavMobile a:hover {
background-color: #ddd;
color: black;
}
.active {
background-color: #aa6204;
color: white;
}
</style>
/* Text color */
.navbar .nav-links .drop-content a {
color: rgb(9, 14, 90);
}
}
/* Dropdown menu CSS code */
.dropdown{
position: relative;
display: inline-block;
color: black;
}
.drop-content, .drop-content2 {
display: none;
position: absolute;
background-color: #962727;
color: black;
min-width: 200px;
width: 100%;
font-size: 16px;
top: 34px;
z-index: 1;
box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.4);
}
/* on hover show dropdown */
.dropdown:hover .drop-content, .dropdown2:hover .drop-content2 {
display: block;
}
/* drondown links */
.drop-content a {
padding: 12px 10px;
/* width: 200px;
border-bottom: 1px solid rgb(197, 197, 250); */
display: block;
transition: all 0.5s ease !important;
}
.dropBtn .drop-content a:hover {
background-color: rgb(230, 230, 230);
}
.dropdown:hover .dropBtn, .dropdown2:hover .dropBtn2 {
background-color: rgba(0, 0, 0, 0.3);
}
.dropdown2 .drop-content2 {
position: absolute;
left: 120px;
top: 126px;
}
.dropBtn2 i {
margin-left: 15px;
}
</style>

View File

@ -0,0 +1,243 @@
---
import Layout from "../layouts/Layout.astro";
import Online from "./Online.vue";
---
<Online/>
<main class="container-fluid navbar ">
<!-- Desktop Menu -->
<div class="container mx-auto flex justify-center z-20">
<div class="hidden md:block py-4">
<div class="navbar">
<a href="/">Home</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">About
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="/aboutus">About Us</a>
<a href="/chairman-message">Chairman Message</a>
<a href="/administrator">Adninistrator</a>
</div>
</div>
<a href="https://center.rgyci.org/center_list">Center List</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Courses
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop z-20">
<a href="https://online.rgyci.org/login/index.php">Online Courses</a>
<a href="#">Offline Courses</a>
</div>
</div>
<div class="dropdownDesktop ">
<button class="dropbtnDesktop">Student Zone
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop z-20">
<a href="https://center.rgyci.org/check_registration">Check Registration</a>
<a href="https://center.rgyci.org/checkresult">Result</a>
<a href="https://center.rgyci.org/chekcertificate">Certificate Verification</a>
<a href="https://center.rgyci.org/download">Download</a>
<a href="http://center.rgyci.org/form/exam_center_login">Online Exam</a>
<a href="https://center.rgyci.org/form/student_placement">Student's Placement Form</a>
<a href="/library">Library</a>
</div>
</div>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Franchise
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="https://center.rgyci.org/how-to-get-franchisee-with-rgyci">Procedure</a>
<a href="https://center.rgyci.org/form/franchise_enquiry">Enquiry</a>
<a href="https://center.rgyci.org/form/companies_placement">Company's Placement Form</a>
</div>
</div>
<a href="/gallery">Gallery</a>
<a href="contactus">Contact Us</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Login
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="https://center.rgyci.org/form/center_login">Center</a>
<a href="https://center.rgyci.org/form/teacher_login">Teacher</a>
</div>
</div>
</div>
</div>
</div>
<!-- Mobile Menu -->
<div class="mobileTopMenu block md:hidden zindex">
<div class="topnavMobile zindex z-20">
<a href="#home" class="active">Logo</a>
<div id="mobileMenu" class="hidden">
<a href="#news">News</a>
<a href="#contact">Contact</a>
<div class="dropdown">
<button class="dropbtn">Dropdown
&#11183
</button>
<div class="dropdown-content zindex z-20">
<a href="#">Link 1</a>
<a href="#">Link 2Link 2Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
</div>
<a class="icon" onclick="openMobileMenu()">
&#9776;
</a>
</div>
</div>
</main>
<script is:inline>
function openMobileMenu() {
var element = document.getElementById("mobileMenu");
element.classList.toggle("hidden");
}
</script>
<style>
.zindex {
z-index: 1;
}
.navbar {
overflow: hidden;
background-color: rgb(150, 39, 39);
/* position: absolute;
width: 100%;
left: 0;
top: 0; */
}
.navbar a {
float: left;
font-size: 16px;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.dropdownDesktop {
float: left;
overflow: hidden;
}
.dropdownDesktop .dropbtnDesktop {
font-size: 16px;
border: none;
outline: none;
color: white;
padding: 14px 16px;
background-color: inherit;
font-family: inherit;
margin: 0;
}
.navbar a:hover, .dropdownDesktop:hover .dropbtnDesktop {
background-color: red;
}
.dropdown-contentDesktop {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown-contentDesktop a {
float: none;
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-contentDesktop a:hover {
background-color: #ddd;
}
.dropdownDesktop:hover .dropdown-contentDesktop {
display: block;
}
/* .mobileTopMenu{
position: absolute;
top:0;
left:0;
width:100%;
} */
.dropdown:hover .dropdown-content {
display: block;
background-color: #ddd;
}
.dropdown-content a:hover {
background-color: #ddd;
}
.dropdown-content {
display: none;
position: absolute;
z-index: 1;
}
.dropdown-content a {
float: none;
text-decoration: none;
display: block;
text-align: left;
}
.topnavMobile {
overflow: hidden;
background-color: #333;
position: relative;
}
.topnavMobile a, .topnavMobile >div > div {
color: white;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
display: block;
}
.topnavMobile a.icon {
background: black;
display: block;
position: absolute;
right: 0;
top: 0;
}
.topnavMobile a:hover {
background-color: #ddd;
color: black;
}
.active {
background-color: #aa6204;
color: white;
}
</style>

View File

@ -1,5 +1,5 @@
<template>
<p class="text-center text-xl bg-red-800 py-1 text-white"><span class="shape px-2 text-blue-700 rounded-md">New</span> <a class="hover:underline" href="https://online.rgyci.org/">Online Learning</a></p>
<p class="text-center text-xl bg-red-800 text-white border-b-2 border-red-900 py-4"><span class="shape px-2 text-blue-700 rounded-md">New</span> <a class="hover:underline" href="https://online.rgyci.org">Online Computer Training</a></p>
</template>
<style>
.shape {

View File

@ -11,12 +11,13 @@ export default function SwiperOne() {
<Swiper
modules={[Navigation, Pagination, Scrollbar, A11y, ]}
spaceBetween={0} slidesPerView={1}
navigation
pagination={{ clickable: true }}
// onSwiper={(swiper) => console.log(swiper)}
// onSlideChange={() => console.log('slide change')}
>
<SwiperSlide><img class="" style={{ width: '100%',}} src="/img/sld/8.jpg" alt="" /></SwiperSlide>
<SwiperSlide><img class="" style={{ width: '100%', zIndex:1}} src="/img/sld/8.jpg" alt="" /></SwiperSlide>
<SwiperSlide><img class="" style={{ width: '100%',}} src="/img/sld/1.jpg" alt="" /></SwiperSlide>
<SwiperSlide><img class="" style={{ width: '100%',}} src="/img/sld/2.jpg" alt="" /></SwiperSlide>
<SwiperSlide><img class="" style={{ width: '100%',}} src="/img/sld/3.jpg" alt="" /></SwiperSlide>

View File

@ -1,22 +1,24 @@
---
import Header from '../components/Header.astro';
import Layout from '../layouts/Layout.astro';
import Online from '../components/Online.vue';
import Menu from '../components/Menu.astro';
import IndexSlider from '../components/IndexSlider.vue';
import Mainfooter from '../components/Mainfooter.astro';
import SwiperOne from '../components/SwiperOne';
---
<Layout title="Welcome to RGYCSM">
<Layout title="Welcome to RGYCI">
<Header/>
<!-- <Online /> -->
<Menu />
<section class="">
</section>
<main class="">
<IndexSlider client:visible/>
<!-- <section>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-16">
<div class="grid box1 shadow-2xl rounded-tr-full rounded-br-full border-8 border-gray-300">
<p class="text-3xl font-bold pt-6 px-6"><span class="underline decoration-4 decoration-red-600">About</span> Us</p>
<p class="w-11/12 text-justify pt-4 px-4 text-xl leading-tight ">The Rajeev Gandhi Youth Computer Saksharta Mission (RGYCSM) Computer Education, Distance Education Institute of with brand name RGYCSM started its Journey in March 2014. The main function of the Trust is to provide higher technical education for every group of urban and rural areas to get success in computer revolution which is the main dream of Indian Govt. RGYCSM is a non Commercial organization engaged in the work of social welfare, started with a mission to education service and spread literacy to all class of people.
<p class="w-11/12 text-justify pt-4 px-4 text-xl leading-tight ">The Rajeev Gandhi Youth Computer Saksharta Mission (RGYCI) Computer Education, Distance Education Institute of with brand name RGYCI started its Journey in March 2014. The main function of the Trust is to provide higher technical education for every group of urban and rural areas to get success in computer revolution which is the main dream of Indian Govt. RGYCI is a non Commercial organization engaged in the work of social welfare, started with a mission to education service and spread literacy to all class of people.
<br>
<div class="p-4"><button class="bg-yellow-400 px-4 py-2 rounded-full shadow-2xl text-white text-xl">Read More</button></div>
</p>
@ -28,97 +30,99 @@ import SwiperOne from '../components/SwiperOne';
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 place-items-center gap-16 ">
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none cursor-pointer">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image1.png" alt="">
<img class="rounded-t-2xl img-size" src="/img/rgyci-img1.jpg" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">06 Months</button>
</div>
</div>
</div>
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image2.png" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<img class="rounded-t-2xl img-size" src="/img/rgyci-img2.jpg" alt="">
<h1 class="h1-text font-bold p-4">DCAAE (Diploma In Computer Application & Accounting Expert)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
</div>
</div>
</div>
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image7.png" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<img class="rounded-t-2xl img-size" src="/img/rgyci-img3.jpg" alt="">
<h1 class="h1-text font-bold p-4">ADCHNE (Advance Diploma In Computer Hardware & Networking Engineering)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
</div>
</div>
</div>
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image4.png" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<img class="rounded-t-2xl img-size" src="/img/rgyci-img4.jpg" alt="">
<h1 class="h1-text font-bold p-4">ADCS (Advance Diploma In Cyber Security)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
</div>
</div>
</div>
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image5.png" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<img class="rounded-t-2xl img-size" src="/img/rgyci-img5.jpg" alt="">
<h1 class="h1-text font-bold p-4">ADOAP (Advance Diploma In Office Accounts & Publishing)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
</div>
</div>
</div>
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image6.png" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<img class="rounded-t-2xl img-size" src="/img/rgyci-img6.jpg" alt="">
<h1 class="h1-text font-bold p-4">ADCA (Advance Diploma In Computer Application)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
</div>
</div>
</div>
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image7.png" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<img class="rounded-t-2xl img-size" src="/img/rgyci-img7.jpg" alt="">
<h1 class="h1-text font-bold p-4">CCLE (Computer Chip Level Engineering)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
</div>
</div>
</div>
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image1.png" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<img class="rounded-t-2xl img-size" src="/img/rgyci-img8.jpg" alt="">
<h1 class="h1-text font-bold p-4">DCAMS (Diploma In Computer Application & Multimedia Specialist)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
</div>
</div>
</div>
<div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
<div class="">
<img class="rounded-t-2xl img-size" src="/img/image2.png" alt="">
<h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
<img class="rounded-t-2xl img-size" src="/img/rgyci-img9.jpg" alt="">
<h1 class="h1-text font-bold p-4">DCCTT (Diploma In Computer Teacher Training)</h1>
<div class="flex place-content-between p-4 button-place hr">
<button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
<button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
</div>
</div>
</div>
</div>
</section>
<SwiperOne client:load />
<!-- <IndexSlider client:visible/> -->
<!-- <SwiperOne client:load /> -->
<!-- image gallery -->
<section class="container mx-auto">
<p class="text-4xl font-bold text-center py-16">Im<span class="underline decoration-4 decoration-red-600">age Gall</span>ery</p>
@ -289,7 +293,7 @@ import SwiperOne from '../components/SwiperOne';
}
.img-size {
width: 300px;
height: 170px;
height: 200px;
}
.button-place {
position: sticky;
@ -298,7 +302,7 @@ import SwiperOne from '../components/SwiperOne';
position: fixed;
}
.h1-text {
font-size: 24px;
font-size: 20px;
color: black;
}
.h1-text:hover {