diff --git a/CNAME b/CNAME index d328014..8d1c8b6 100644 --- a/CNAME +++ b/CNAME @@ -1 +1 @@ -www.linuxdelhi.org + diff --git a/assets/css/main.css b/assets/css/main.css index 1130496..9beb1af 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -2,148 +2,282 @@ html { box-sizing: border-box; } -*, *:before, *:after { - box-sizing: inherit; + +body{ + margin: 0; + width: 100%; + height: 100vh; + position: relative; + padding: 10px; + background: #000; + color: #000; + box-sizing: border-box; + font-family: 'Montserrat', sans-serif; + /*animation-name: bg-appear; + animation-duration: 7s; + animation-timing-function: ease-in; + animation-fill-mode: forwards;*/ } -body { - font-family: 'PT Sans', sans-serif; - text-align: center; - max-width: 1200px; - margin: 0 auto; - padding-left: 1em; - padding-right: 1em; +.wrapper::-webkit-scrollbar { + display: none; +} + +.wrapper{ + width: 100%; + height: 100%; + display: grid; + grid-template-columns: 1fr 1fr; + /*display: flex; + flex-wrap: wrap;*/ + background: #FFD97D; + background-image: radial-gradient(#e2bf6a 15%, #FFD97D 15%); + background-size: 20px 20px; + background-repeat: repeat; + animation-name: bg-move; + animation-duration: 10s; + animation-timing-function: linear; + animation-iteration-count: infinite; + padding: 10px; + box-sizing: border-box; + border-radius: 5px; + overflow-x: hidden; + overflow-y: scroll; +} + +@keyframes bg-move { + from {background-position:0 0;} + to {background-position: 500px 500px;} +} +@keyframes bg-appear { + from {filter: opacity(0); } + to {filter: opacity(1);} +} + +/*section{ + border: 1px solid black; +}*/ + +.header{ + height: 50%; + flex-grow: 1; + height: 100%; display: flex; - -webkit-justify-content: center; - -ms-flex-pack: center; + align-items: center; justify-content: center; - -webkit-flex-direction: column; - -ms-flex-direction: column; - flex-direction: column; } - -section{ - padding-top: 5px; } -.header-logo{ - width: 25%; +.content{ + width: 60%; + position: relative; } -@media (max-width: 500px) { - .header-logo{ - width: 55%; - } +.navbar{ + display: flex; + width: 100%; + justify-content: flex-end; + margin-bottom: 30px; } -p { - font-size: 25px; +.navbar .link{ + color: inherit; + text-decoration: none; + padding: 5px; + cursor: pointer; + margin-left: 10px; +} +.navbar .link:hover{ + background: #000; + color: #FFD97D; + border-radius: 3px; } -h1{ - font-size: 35px; +.logo{ + background: url("../img/ilugdlogo.svg"); + background-size: contain; + background-repeat: no-repeat; + width: 100px; + height: 150px; } -a { - text-decoration: none; - transition: all 0.3s ease; - border-bottom: 1px solid transparent; - color: #000; +.logotype{ + font-size: 60px; + font-weight: 800; + transition: all 0.3s ease-in-out; } -a:hover, a:active { - +.logotype:hover{ + -webkit-text-stroke-width: 2px; + -webkit-text-stroke-color: black; + color: #fff; + filter: drop-shadow(5px 5px #000); } -.page-home .social-links { - margin-top: 30px; +.intro{ + font-size: 25px; + font-weight: 300; } -.page-home .social-links ul { - text-align: left; +.dropper{ display: inline; - margin: 0; - list-style: none; - padding-left: 0px; + padding-top: 5px; } -.page-home .social-links li a { - padding: 5px 10px; - background: #fff; - cursor: pointer; - display: inline-block; - border-bottom: 1px solid #00cc88; + +.dropper:hover .drop-wrap{ + display: block; } -.page-home .social-links li:hover a { - color: #000; - border: None; - background: #00e699; - border-bottom: 1px solid #000; -} -.page-home .social-links ul li { - display: inline-block; - margin-right: -4px; - margin-bottom: 0; - position: relative; - -webkit-transition: all 0.2s; - -moz-transition: all 0.2s; - -ms-transition: all 0.2s; - -o-transition: all 0.2s; - transition: all 0.2s; -} -.page-home .social-links ul li ul { - padding: 0; - position: absolute; - top: 28px; - left: 0; - width: 150px; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; + +.drop-wrap{ display: none; - opacity: 0; - visibility: hidden; - -webkit-transiton: opacity 0.2s; - -moz-transition: opacity 0.2s; - -ms-transition: opacity 0.2s; - -o-transition: opacity 0.2s; - -transition: opacity 0.2s; - z-index: 1; -} -.page-home .social-links ul li ul li a{ - background: #376fa0; - display: block; - width: 150px; - color: #fff; + position: absolute; + padding-top: 10px; } -.page-home .social-links ul li ul li small { - font-size: 56%; + +.drop{ + background: #000; + border-radius: 4px; + padding: 5px; } -.page-home .social-links ul li ul li:hover a { background: #00e699; } -.page-home .social-links ul li:hover ul { + +.drop a{ display: block; - opacity: 1; - visibility: visible; + color: #FFD97D; + text-decoration: none; + padding: 5px; + border-radius: 3px; } -.page-home .section--next_event { - margin-top: 3.5em; - text-align: center; - transition: all 0.5s ease; - opacity: 0; +.drop a:nth-child(1){ + margin-bottom: 5px; } -.page-home .section--next_event .caption { - display: inline-block; - background-color: #11fac2; - background-color: ##eee; - padding: 10px; + +.drop a:hover{ + color: #000; + background: #FFD97D; +} + +.social{ + display: flex; + width: 100%; + font-size: 20px; + justify-content: space-between; + margin-top: 50px; } -.page-home .section--next_event a { - display: inline-block; + +.social a{ + color: inherit; + text-decoration: none; padding: 10px; - background-color: #fdf7d6; - border-bottom: none; -} -.page-home .section--next_event a:hover { - border-bottom: none; - background-color: #e4dfc0; - /*background-color: #eee;*/ - color: #111; + width: 20px; + height: 20px; + display: flex; + justify-content: center; + align-items: center; + border-radius: 50%; +} + +.social a:hover{ + background: #e2bf6a; +} + +.meetup{ + background: #EE6055; + /*width: 50%;*/ + border-radius: 5px; + display: flex; + align-items: center; + justify-content: center; +} + +.caption{ + font-size: 40px; +} + +.desc{ + font-size: 30px; + color: #fff; + margin: 10px 0; +} + +.date{ + font-size: 25px; + color: #FFD97D; +} + +.button-primary{ + padding: 10px 20px; + margin-top: 25px; + margin-bottom: 25px; + background: #fff; + border-radius: 35px; + width: 150px; + display: flex; + justify-content: space-between; + cursor: pointer; + transition: all 0.3s ease-in-out; +} + +.button-primary:hover{ + box-shadow: 0px 10px 5px -5px rgba(0, 0, 0, 0.2); + transform: translateY(-5px); +} + + +@media only screen and (max-width: 450px){ + + .wrapper{ + width: 100%; + height: 100%; + display: grid; + grid-template-rows: 1fr 1fr; + grid-template-columns: 1fr; + grid-row-gap: 20px; + } + + .navbar{ + padding: 0 10px; + background: #FFD97D; + border-radius: 3px; + font-size: 15px; + box-sizing: border-box; + } + + .social{ + margin: 0 auto; + } + + .content{ + width: 95%; + position: relative; + } + + .logo{ + width: 50px; + height: 75px; + } + + .logotype{ + font-size: 50px; + } + + .intro{ + font-size: 20px; + } + + .caption{ + font-size: 25px; + } + + .desc{ + font-size: 20px; + } + + .date{ + font-size: 18px; + } + + .button-primary{ + width: 75px; + font-size: 15px; + padding: 5px 10px; + } } diff --git a/assets/img/ilugdlogo.svg b/assets/img/ilugdlogo.svg new file mode 100755 index 0000000..74baaf1 --- /dev/null +++ b/assets/img/ilugdlogo.svg @@ -0,0 +1,49 @@ + + + + + + + + + + + + + + + + + diff --git a/assets/img/linussss.png b/assets/img/linussss.png new file mode 100755 index 0000000..0989acf Binary files /dev/null and b/assets/img/linussss.png differ diff --git a/assets/js/main.js b/assets/js/main.js index 8484b2d..852609a 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,3 +1,6 @@ + + + function display_next_event(el) { // Display the next event available on meetup.com in the given html element. // @@ -29,11 +32,12 @@ function display_next_event(el) { var next_event = response.data.next_event; // display only when there is an event. if (next_event){ - var event_title = next_event.name + ' (' + timeConverter(next_event.time) + ')'; + var event_title = next_event.name; + var date = imeConverter(next_event.time); var event_url = 'http://www.meetup.com/'+meetup_group+'/events/' + next_event.id; - var html = ''+ caption +'' + event_title + ''; + var html = '

'+ caption +'

' + event_title + '

' + date + ''; $(el).html(html).css({'opacity': 1}); }; } }); -} \ No newline at end of file +} diff --git a/index.html b/index.html index acbb098..187223d 100644 --- a/index.html +++ b/index.html @@ -1,54 +1,77 @@ + Indian Linux User Group Delhi - + + + -Fork me on GitHub + -
- -

Welcome to the India Linux Users Group Delhi

-
-
- +
+ +
+
+
+ About +
+ Mailing list +
+
+ Subscribe + Guidelines +
+
+
+
+
+ +
+ !LUG-D +
+
+

+ Welcome to the
India Linux Users Group Delhi. +

+ +
+
+ +
+
+
+

Next Meetup

+

Indian Linux User's Group Delhi(NCR) Meetup

+ 28th October 2017 +
Details →
+
-
- - + +
+ + + + diff --git a/links.html b/links.html new file mode 100644 index 0000000..44bab31 --- /dev/null +++ b/links.html @@ -0,0 +1,21 @@ +Subscribe +Guidelines +MeetUp +Google Group +Facebook Page +Twitter +Telegram +Reddit +Matrix +Github + +
+ + + + +var html = '

'+ caption +'

' + event_title + '

' + date + '';