Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

Projects in Awesome Lists tagged with grid-layout

A curated list of projects in awesome lists tagged with grid-layout .

https://github.com/helciodev/directory-of-schools

In this project I am required to use HTML and CSS to build an online directory of schools website

background-video css3 flexbox grid-layout html5

Last synced: 21 Oct 2024

https://github.com/kgcreative/neat-omega

An omega mixin family for Neat 2.x

bourbon grid-layout neat omega

Last synced: 20 Dec 2024

https://github.com/jonkirathe/angularsignal

Angular Signal App is an application that can help you learn Angular Signals. Signals were introduced in Angular v16

angular css grid-layout html signal

Last synced: 11 Nov 2024

https://github.com/dinanathsj29/css-grid-beginners-tutorial

CSS Grid tutorial for all, This is comprehensive guide to CSS Grid layout (Two Dimensional Layout which handles Columns as well Rows). This complete guide explains everything about CSS Grid.

css-grid display-grid fr-unit grid-area grid-areas grid-cells grid-container grid-gap grid-items grid-layout grid-layout-demo grid-lines grid-practical-demo grid-tutorial

Last synced: 25 Nov 2024

https://github.com/jojoee/bootstrap-sass-grid

:tada: Bootstrap grid and Responsive utility "ONLY"

bootstrap bootstrap-grid css grid grid-layout

Last synced: 07 Nov 2024

https://github.com/alitahir4024/xtra-theme

Xtra Theme is an fully HTML and CSS developed project.

css dropdown flexbox-css grid-layout html html-css insurance xtra-theme

Last synced: 07 Dec 2024

https://github.com/jpdf00/html-and-css-2.0-project-2-building-with-responsive-design

This the second project in Microverse's HTML and CSS module. It consists of a reproduction of The Next Web (https://thenextweb.com/) homepage.

flexbox grid-layout responsive-web-design

Last synced: 07 Dec 2024

https://github.com/phphe/vue-colrow

Vue smarter layout components. Based on css flexbox. Support responsive design, server side render. 5 KB gzipped.

grid-layout layout responsive-layout vue

Last synced: 12 Nov 2024

https://github.com/adamseckel/flex-attributes

Compose layout with flexbox in html.

attributes css flexbox grid-layout mobile-first

Last synced: 07 Nov 2024

https://github.com/starostinlf/tkbo-03-21-website

Информационный многостраничник для группы ТКБО-03-21 (РТУ МИРА, ИПТИП, кафедра компьютерного дизайна)

bootstrap5 css flexbox grid-layout html jquery scss

Last synced: 04 Dec 2024

https://github.com/andre-araujo/react-configurable-grid

A simple react configurable grid inspired on grid-styled and react-bootstrap with open settings.

component components cssinjs grid grid-layout grid-system react reactjs

Last synced: 04 Dec 2024

https://github.com/numandev1/react-native-masonry-grid

Customizable masonry Flatlist. it just behave like Flatlist but using ScrollView behind the scene

android flatlist gallery grid grid-layout ios list masonry masonry-flatlist masonry-grid masonry-list masonry-scroll pinterest react-native scrollview

Last synced: 24 Oct 2024

https://github.com/skyv26/raspbian-community-conference

The Raspbian Community Conference is a brand-new event led by the Raspberry Pi Foundation with lots of help from our community of young people, educators, hobbyists, and tech enthusiasts. It will be a chance for people of all ages and skill levels to have a go at getting creative with tech.

a11y accessibility css css3 dart-sass-compiler flex flexbox flexible grid grid-layout html html5 intersectionobserver-api responsive responsive-design responsive-layout responsive-web-design sass scss

Last synced: 30 Dec 2024

https://github.com/kumarsidharth/12-column-grid

Light weight CSS library that provides CSS classes for creating 12 column grid layout.

css css-grid grid grid-layout scss

Last synced: 08 Dec 2024

https://github.com/skyv26/portfolio

Portfolio is made with vanilla-js and I did it with my partner. I have added so many user interaction and the most importantly I made it Accessible so that disabled person can be able to navigate through my portfolio.

accessibility branches css3 flexbox-layout github-actions github-pages grid-layout html html5 javascript media-queries portfolio pull-requests responsive-web-design vanilla-js

Last synced: 30 Dec 2024

https://github.com/afonsopacifer/react-calendar

:calendar: Calendar for Developers.

calendar grid-layout react redux style-guide tdd

Last synced: 15 Oct 2024

https://github.com/nkhdo/vue2-grid-layout

Vue 2 grid layout

grid-layout vue

Last synced: 09 Nov 2024

https://github.com/mahammad-mostafa/personal-portfolio

That is the second project in the first module at Microverse program. It is a portfolio website built from a template in Figma.

css3 es6-javascript eslint flexbox grid-layout html-css-javascript html5 microverse microverse-projects microverse-students mit-license responsive-layout responsive-website styelint webhint

Last synced: 18 Oct 2024

https://github.com/bootscore/bs-grid

WordPress plugin to show posts, child-pages or custom post types in grid / list cards or heroes in Bootscore theme.

bootscore bootstrap5 grid-layout wordpress wordpress-plugin

Last synced: 06 Nov 2024

https://github.com/abdussattar-70/capstone-1

This repThis repo is a part of the learning purpose that I made to how to use html css and js best practices.

css3 flexbox grid-layout html5 javascript

Last synced: 20 Oct 2024

https://github.com/thoughtscript/x_team_vue

Vue 2.5, Router, Webpack 3.6 for X-Team

firebase grid-layout vuejs2 webpack3

Last synced: 24 Nov 2024

https://github.com/yeaseen/fileexplorer

A tree or grid view based File explorer system with UI built in javafx and design issues are followed by Factory pattern, Composite pattern and Adapter pattern.

adapter-pattern composite-pattern design-patterns factory-pattern file-explorer grid-layout javafx javafx-gui tile-view tree-structure

Last synced: 19 Nov 2024

https://github.com/starsheriff2/thenextweb-responsive-design-clone

NextWeb.com homepage clone. The objective was to create a fully responsive website for different viewports and screen sizes. Lots of grids and flexboxes were used here. Background images were used to make images responsive and keep the aspect ratio.

aspect-ratio background-image flexbox grid-layout html outline-tree responsive-design responsive-web-design

Last synced: 27 Dec 2024

https://github.com/the-manpreet-singh/personal-blog-website

Udacity Front-End Web Developer Nanodegree Program 1st project, I'm using CSS, Website Layout, Website Components in this project

css3 css3-flexbox css3-grid gird grid-layout htm5 social-links

Last synced: 11 Nov 2024

https://github.com/cmolinan/portfolio-project

This Portfolio was built entirely in HTML/CSS and JavaScript for DOM Manipulation, using technologies such as Flexbox and Grid, and applying Responsive design. It is based on a FIGMA design

css3 figmadesign flexbox grid-layout html5 responsive-web-design

Last synced: 27 Oct 2024

https://github.com/powerlevel9000/personal-portfolio

it is sort portfolio for me as i started my webdevlopment by building this stuffs as learning perpouse do check out it is simple elegent responsive and clear portfolio

css3 flexbox-css grid-layout html5

Last synced: 03 Nov 2024

https://github.com/mozameljawad/metrics-webapp

Metrics Web App is an outstanding mobile web application listing all active companies in the financial market. This project has two pages. The first page is the application's main page, which lists all companies with a search bar. When someone clicks on the company, the user will be redirected to the second page, showing all the details of the comp

css3 grid-layout html5 jest-tests reactjs redux-toolkit test-library-react testng

Last synced: 19 Nov 2024

https://github.com/creoone/x001f

CSS GRID FRAMEWORK

css framework grid grid-layout grid-system

Last synced: 25 Dec 2024

https://github.com/skyv26/math-magician

Math Magician is the intermediate project for learning React.js in a fun and interactive way. This project will be updated from time to time by adding the features step by step. In this project, we will see Mathematics related utilities like calculators and some tricks or magic.

calculator-application css3 es6 eslint eslint-config flexbox-css flexbox-grid grid-layout jsx-syntax react reactjs single-page-app spa style stylelint

Last synced: 30 Dec 2024

https://github.com/tsheporamantso/my-resume

Professional resume, depicting acquired skills, education, work experience and projects I've worked on thus far.

flexbox grid-layout html5 scss-framework

Last synced: 06 Dec 2024

https://github.com/mashamoreva/mesto-project-bootcamp

📷 Проект: "Mesto Russia"

flexbox grid-layout media-queries

Last synced: 29 Nov 2024

https://github.com/ahammadshawki8/windows10-start-menu-clone

A simple clone of Windows10 Start Menu created with CSS Grid Layout 🐛

clone grid-layout start-menu windows-10

Last synced: 28 Dec 2024

https://github.com/bradsec/gridgg

For use with Go Graphics fogleman/gg. Functions assist with simplifying position of images and text using positive grid x, y axis references. Ensures images are placed on the canvas in correct alignment and within set padding values.

2d-graphics go golang grid grid-layout grid-system

Last synced: 10 Nov 2024

https://github.com/brytebee/newsweek

This project (https://microverse.org) replicates the Newsweek website with an emphasis on layout different screens. Built with Bootstrap.

bootstrap css3 grid-layout html5

Last synced: 08 Dec 2024

https://github.com/0mppula/polish_cow

A simple web application that generates dancing cows while playing Gdzie jest biały węgorz ? (Zejście) by: Cypis. created with vanilla JavaScript, HTML & CSS.

cow css3 dom-manipulation grid-layout html5 javascript music polish

Last synced: 11 Nov 2024

https://github.com/mahenrique94/css-grid-layout

Post para meu blog pessoal:

css css3 grid-layout post

Last synced: 08 Dec 2024

https://github.com/saketkothari/cloudify

The most reliable HTML, CSS, simple template for developing responsive, mobile first web applications on the web.

aos-animation css3 flexbox grid-layout html5 mobile-first normalize-css responsive-website typography

Last synced: 26 Nov 2024

https://github.com/siegblink/webdev-resources

Collection of helpful web development resources.

bookmarks bookmarks-manager grid-layout javascript reactjs

Last synced: 08 Nov 2024

https://github.com/captain-woof/react-waterfall-grid

React Waterfall Grid is a library of fully responsive, animated and customizable waterfall grids (vertical and horizontal). All it needs is an array of your elements, and it handles the rest out-of-the-box.

grid-layout npm npm-package react-components reactjs waterfall-layout

Last synced: 31 Dec 2024

https://github.com/alsuhaibi96/medical-demo-webapp

The project was created as a challenge to practice responsiveness .It is made with just HTML and CSS

flexbox-css grid-layout responsive-web-design

Last synced: 02 Jan 2025

https://github.com/jojoee/jeans-kit

:jeans: (Beta) Simple and clean frontend toolkit that you can wear it everywhere

css grid-layout

Last synced: 19 Dec 2024

https://github.com/jomagene/time-tracking-dashboard

This repository contains the "Time Tracking Dashboard" solution, built with HTML for structure, Sass for responsive styling using mixins, media queries, and Grid, and JavaScript for fetching JSON data and updating the DOM.

async-await dom-manipulation fetch grid-layout mixins sass

Last synced: 15 Oct 2024

https://github.com/anselemodims/calculator

Calculator is a single-page application built to calculate simple mathematical operations. It is built using React and CSS.

components grid-layout hooks javascript jest react react-router reactjs usestate-hook

Last synced: 07 Dec 2024

https://github.com/juzershakir/countdown

A countdown web application made with HTML, CSS & JS

countdown-timer css grid-layout javascript sass

Last synced: 18 Dec 2024

https://github.com/the-akira/gatsby-react-blog

Yet another blog experiment with Gatsby-React

gatsby gatsbyjs graphql grid-layout javascript markdown prismjs react reactjs scss

Last synced: 17 Nov 2024

https://github.com/hamdysalah1/thegrid

React grid layout using styled-component and flexbox

flexbox grid-layout reactjs styled-components

Last synced: 06 Dec 2024

https://github.com/vxhly/grid-scss

Grid 网格布局神器，Grid Layout 是一种基于二维网格的布局系统，旨在完全改变我们设计基于网格的用户界面的方式，弥补网页开发在二维布局能力上的缺陷,可以通过 bower 和 npm 下载

grid grid-layout sass scss

Last synced: 17 Nov 2024

https://github.com/tmallet/lama

LaMa, for Layout Manager, is a Bootstrap v4 grid builder.

bootstrap bootstrap-vue bootstrap4 builder grid grid-layout vue-components vuejs2

Last synced: 19 Dec 2024

https://github.com/dolbilov/russian-travel

Course project of Yandex.Practicum. Theme - Adaptive and responsive layout.

adaptive-design css3 flexbox grid grid-layout html5 responsive

Last synced: 17 Nov 2024

https://github.com/the-akira/flask-illuminati-app

A simple Illuminati themed blog made with Flask

flask flask-application grid-layout heroku herokuapp markdown python3

Last synced: 17 Nov 2024

https://github.com/mrbrunelli/my-portfolio

Meu portfólio, consumindo dados da API pública do Github | TypeScript + ReactJS + CSS Grid Layout

css grid-layout reactjs typescript

Last synced: 15 Nov 2024

https://github.com/jomagene/testimonial-grid

A responsive testimonial grid built with CSS Grid and flex-box, semantic HTML, and Sass/SCSS. Designed to adapt across devices with clean, maintainable code.

flexbox grid-layout media-queries sass

Last synced: 17 Nov 2024

https://github.com/kaushikshivam/natours

Natours is a landing page for a travel website which lets you book nature tours

clippath css-animations css-framework css3 floats grid-layout html5 keyframe landing-page-theme landingpage nature

Last synced: 27 Dec 2024

https://github.com/iambasilp/service-test

In this website i learned structural design

css grid-layout grid-system html

Last synced: 01 Jan 2025

https://github.com/iambasilp/grid_css

CSS Grid Layout is a two-dimensional layout system for the web. It lets you lay content out in rows and columns. It has many features that make building complex layouts straightforward.

grid grid-layout scss-framework

Last synced: 01 Jan 2025

https://github.com/ujw0l/js-masonry

Vanilla Js library to lay elements in masonry grid in optimal positions

grid-layout js-masonry lay-elements masonry masonry-grid optimal-positions ujw0l vanilla-js-library

Last synced: 12 Dec 2024

https://github.com/ahmed-roshdy-1/ar-home

It is a website for selling house and furniture

grid grid-layout grid-system home house-selling scss scss-framework selling-houses

Last synced: 13 Nov 2024

https://github.com/mathew-kurian/react-fast-grid

Useful Grid/Hidden algorithm from Material-UI

column-reverse flex flexbox grid grid-layout grids hidden material-ui react

Last synced: 19 Nov 2024

https://github.com/pastekaztekastor/crowd-simulation

Le projet consiste en une simulation de foule sur une grille, avec des versions parallélisées sur carte graphique. L'objectif est de modéliser le mouvement des individus dans un environnement en utilisant des paramètres tels que la dimension de la grille, le nombre d'individus et exporte de résultat de chaque frame dans unfichier bin pour analyse.

c cmake cpp crowdsimulation cuda-programming graphicscard grid-layout ipynb make nvidia-gpu parallelization

Last synced: 13 Nov 2024

https://github.com/ryu-man/reactjs-layouts

Easily structure your React app using CSS Flexbox & Grid declarative components

css css-flexbox css-grid flexbox flexbox-layout grid grid-layout html layout react

Last synced: 17 Dec 2024

https://github.com/thiagoow/layoutsui-pughtml-sass

Criado para praticar construção de UI's com CSS Grid Layout. Com Webpack 5, e os pré-processadores de HTML e CSS, respectivamente: Pug & Sass

css-grid css-grid-layout grid grid-layout pug-plugin pug-template-engine pugjs sass sass-framework webpack webpack5

Last synced: 06 Nov 2024

https://github.com/noherczeg/dashing-css

A standard Dashboard built with up-to-date CSS techniques.

css3 flexbox flexbox-layout grid-layout html5 web-components

Last synced: 19 Dec 2024

https://github.com/thyagohsr/bikcraft

O projeto BikeCraft foi feito a partir do curso Front end e UX UI Design da Origamid onde usei grid layout e flexbox.

flexbox-css grid-layout responsive-web-design

Last synced: 11 Nov 2024

https://github.com/mnv17/wandering-noise-6021

LST E-commerce web (LYST.com Replica)

css grid-layout html javascript json-api json-server

Last synced: 19 Nov 2024

https://github.com/arodax/css-grid

Modern, simple and easy to use CSS grid.

css grid-layout

Last synced: 12 Nov 2024

https://github.com/iryna-vyshniak/news

The test page with the latest news provides access to the latest and breaking news for a country, for a specific category in a country. The news articles are sorted by the publish date.

grid-layout newsdataapi notiflix-notify notiflix-report notify search-form

Last synced: 15 Dec 2024

https://github.com/shfshanyue/grid-guide-chinese

[译] Grid 布局完全指南

css grid grid-layout

Last synced: 28 Nov 2024

https://github.com/preethi-dev/modern-layout-12

CSS Grid and Flexbox enable the modern layouts. This 12th layout of modern layout series made by ASCII-ART method of grid layout. #Made-In-CSS-Grid

ascii-art-method css-grid css3 grid-layout grid-template-areas html5 modern-layout modern-layout-12 responsive-web-design

Last synced: 11 Nov 2024

https://github.com/preethi-dev/modern-layout-25

CSS Grid and Flexbox enable the modern layouts. This 25th layout of modern layout series made by CSS Grid Line Based Placement. #Made-In-CSS-Grid

css css-flexbox css-grid css3 grid-layout html5 line-based-placement modern-layout modern-layout-25 responsive-web-design

Last synced: 11 Nov 2024

https://github.com/matuzalemsteles/simba

🦁 GRID system, simple, flexible and scalable for small, medium and large projects.

css flexible grid grid-layout simba

Last synced: 24 Dec 2024

https://github.com/skutam/angular-drag-drop-layout

Angular Drag Drop Layout is a lightweight, dependency-free Angular library for creating highly customizable, responsive grid layouts with drag-and-drop functionality. Built with Angular 18 and utilizing Angular Signals, this library provides a seamless and optimized experience for building dynamic and interactive layouts.

angular drag-and-drop grid-layout lightweight resizable responsive

Last synced: 19 Sep 2024

https://github.com/leonidasesteban/faster-css-master

3ra clasde de CSS Master

css grid-layout

Last synced: 09 Nov 2024

https://github.com/klich3/960

css 960 grid layouts short classes

960 960-grid css css-grid css3 grid grid-layout grid-system layout module scss scss-styles

Last synced: 12 Oct 2024

https://github.com/pieter-rees/css-grid-grid

This is a grid build on CSS grid :)

css css-grid css-modules grid grid-layout grid-system grids

Last synced: 19 Dec 2024

https://github.com/mahammad-mostafa/game-industry-conference

This is the capstone project for the first module in Microverse program. It represents a conference event for video game development.

css3 es6 flexbox github-flow grid-layout html-css-javascript html5 microverse microverse-projects responsive-layout responsive-web-design semantic-web

Last synced: 08 Dec 2024

https://github.com/zhentian-wan/grid-layout-demo

Learn how to use grid layout system

css3 grid-layout

Last synced: 11 Nov 2024

https://github.com/chandraprakash-bathula/grid-garden-solutions

This repository contains all the solutions of grid-garden game.

css3 flexbox-grid grid-layout html5

Last synced: 28 Dec 2024

https://github.com/cleilsonandrade/player_musica

Single page de um player de musica, para estudos da propriedade grid do CSS.

css design grid-layout music-player player

Last synced: 10 Nov 2024

https://github.com/bibhushankarki/multiplatformsite-ui

Found an unfinished UI of a multi-platform web app when i was working at Skardtech.

flexbox-css grid-layout html-css-javascript music-player-ui

Last synced: 18 Nov 2024

https://github.com/yifaneye/grilled

🏁 Library of responsive grid system with any of 1 to 12 columns 👉 npm i grilled

grid grid-layout grid-system responsive responsive-design responsive-grid responsive-layout

Last synced: 28 Dec 2024

https://github.com/chicacode/shecodes

shecodes practice yoga page made with html and css

css-grid css3 flexbox flexbox-css flexbox-grid grid-layout html html5

Last synced: 21 Nov 2024

https://github.com/barbaracalderon/simple-grid-layout-landing-page

Very simple and responsive landing page using the Grid Layout for CSS, with a dropdown menu. No Javascript. // Uma landing page bem simples e responsiva usando o Grid Layout, com menu dropdown. Sem Javascript.

css dropdown-menu grid-layout html

Last synced: 28 Nov 2024

https://github.com/samedfft2634/scheduler

Created with React. Simple practice for me to improve my skills.

cssmodules grid-layout html5 js reactjs responsive-web-design yarn

Last synced: 28 Nov 2024

https://github.com/vladocar/child-selector-system-css_framework

Child Selector System is experimental CSS Framework that use child selectors for making multiple simple (column) grid.

css css-framework css-selector grid grid-layout

Last synced: 20 Nov 2024

https://github.com/rinaldilucas/flexbox-grid-example

Simple project with some examples of flexbox and grid layouts.

css flex flexbox grid grid-layout

Last synced: 15 Nov 2024

https://github.com/lorddashme/css-dump-designs

A collection of CSS designs templates.

css css-designs flexbox grid-layout practices

Last synced: 15 Nov 2024