diff --git a/.astro/data-store.json b/.astro/data-store.json index a929187..dd2792e 100644 --- a/.astro/data-store.json +++ b/.astro/data-store.json @@ -1 +1 @@ -[["Map",1,2],"meta::meta",["Map",3,4,5,6],"astro-version","5.3.0","astro-config-digest","{\"root\":{},\"srcDir\":{},\"publicDir\":{},\"outDir\":{},\"cacheDir\":{},\"compressHTML\":true,\"base\":\"/\",\"trailingSlash\":\"ignore\",\"output\":\"static\",\"scopedStyleStrategy\":\"attribute\",\"build\":{\"format\":\"directory\",\"client\":{},\"server\":{},\"assets\":\"_astro\",\"serverEntry\":\"entry.mjs\",\"redirects\":true,\"inlineStylesheets\":\"auto\",\"concurrency\":1},\"server\":{\"open\":false,\"host\":false,\"port\":4321,\"streaming\":true},\"redirects\":{},\"image\":{\"endpoint\":{\"route\":\"/_image\"},\"service\":{\"entrypoint\":\"astro/assets/services/sharp\",\"config\":{}},\"domains\":[],\"remotePatterns\":[]},\"devToolbar\":{\"enabled\":true},\"markdown\":{\"syntaxHighlight\":\"shiki\",\"shikiConfig\":{\"langs\":[],\"langAlias\":{},\"theme\":\"github-dark\",\"themes\":{},\"wrap\":false,\"transformers\":[]},\"remarkPlugins\":[],\"rehypePlugins\":[],\"remarkRehype\":{},\"gfm\":true,\"smartypants\":true},\"security\":{\"checkOrigin\":true},\"env\":{\"schema\":{},\"validateSecrets\":false},\"experimental\":{\"clientPrerender\":false,\"contentIntellisense\":false,\"responsiveImages\":false,\"serializeConfig\":false},\"legacy\":{\"collections\":false}}"] \ No newline at end of file +[["Map",1,2],"meta::meta",["Map",3,4,5,6],"astro-version","5.12.9","astro-config-digest","{\"root\":{},\"srcDir\":{},\"publicDir\":{},\"outDir\":{},\"cacheDir\":{},\"compressHTML\":true,\"base\":\"/\",\"trailingSlash\":\"ignore\",\"output\":\"static\",\"scopedStyleStrategy\":\"attribute\",\"build\":{\"format\":\"directory\",\"client\":{},\"server\":{},\"assets\":\"_astro\",\"serverEntry\":\"entry.mjs\",\"redirects\":true,\"inlineStylesheets\":\"auto\",\"concurrency\":1},\"server\":{\"open\":false,\"host\":false,\"port\":4321,\"streaming\":true,\"allowedHosts\":[]},\"redirects\":{},\"image\":{\"endpoint\":{\"route\":\"/_image\"},\"service\":{\"entrypoint\":\"astro/assets/services/sharp\",\"config\":{}},\"domains\":[],\"remotePatterns\":[],\"responsiveStyles\":false},\"devToolbar\":{\"enabled\":true},\"markdown\":{\"syntaxHighlight\":{\"type\":\"shiki\",\"excludeLangs\":[\"math\"]},\"shikiConfig\":{\"langs\":[],\"langAlias\":{},\"theme\":\"github-dark\",\"themes\":{},\"wrap\":false,\"transformers\":[]},\"remarkPlugins\":[],\"rehypePlugins\":[],\"remarkRehype\":{},\"gfm\":true,\"smartypants\":true},\"security\":{\"checkOrigin\":true},\"env\":{\"schema\":{},\"validateSecrets\":false},\"experimental\":{\"clientPrerender\":false,\"contentIntellisense\":false,\"headingIdCompat\":false,\"preserveScriptOrder\":false,\"liveContentCollections\":false,\"csp\":false,\"rawEnvValues\":false},\"legacy\":{\"collections\":false}}"] \ No newline at end of file diff --git a/.astro/settings.json b/.astro/settings.json index 4970e0b..1f41652 100644 --- a/.astro/settings.json +++ b/.astro/settings.json @@ -1,5 +1,5 @@ { "_variables": { - "lastUpdateCheck": 1740190382923 + "lastUpdateCheck": 1755103740631 } } \ No newline at end of file diff --git a/package.json b/package.json index fd0a293..4482e6f 100644 --- a/package.json +++ b/package.json @@ -14,10 +14,11 @@ "@types/react": "^19.0.10", "@types/react-dom": "^19.0.4", "astro": "^5.3.0", + "latest": "^0.2.0", "lodash": "^4.17.21", "react": "^19.0.0", "react-dom": "^19.0.0", "react-select": "^5.10.0", "tailwindcss": "^4.0.8" } -} \ No newline at end of file +} diff --git a/src/cra-project/components/ProjectList/CardsContainer.jsx b/src/cra-project/components/ProjectList/CardsContainer.jsx index fc4da2f..bbe0f77 100644 --- a/src/cra-project/components/ProjectList/CardsContainer.jsx +++ b/src/cra-project/components/ProjectList/CardsContainer.jsx @@ -39,6 +39,7 @@ export default class CardsContainer extends React.Component { } handleSelectChange(selectedOptions) { + console.log(selectedOptions) const valueArray = Array.isArray(selectedOptions) ? selectedOptions : [selectedOptions]; @@ -48,28 +49,20 @@ export default class CardsContainer extends React.Component { handleFilterListUpdate(value) { let updatedList = [...projectList]; - - if ( + console.log("the values in handlefilter : "+value); + /* if ( (!value || value.length === 0) && (!this.inputValue || this.inputValue.length === 0) ) { return this.setState({ filterList: this.sortArrayRandom(projectList) }); - } + } */ // If tags filter applied - if (value.length > 0) { - const valueList = value.map((v) => v.value.toLowerCase()); - - updatedList = updatedList.filter( - (project) => - project.tags && - project.tags.some((tag) => valueList.includes(tag.toLowerCase())) - ); - } - + //if(!value) return this.setState({ filterList: this.sortArrayRandom(projectList) }); + // If search input value is not empty - if (this.inputValue && this.inputValue.trim().length > 0) { - const searchTerm = this.inputValue.toLowerCase(); + if (!Array.isArray(value) && value && value.length>0) { + const searchTerm = value.toLowerCase(); updatedList = updatedList.filter( (project) => @@ -80,6 +73,17 @@ export default class CardsContainer extends React.Component { ); } + if (Array.isArray(value) && value.length>0) { + + const valueList = value.map((v) => v.value.toLowerCase()); + + updatedList = updatedList.filter( + (project) => + project.tags && + project.tags.some((tag) => valueList.includes(tag.toLowerCase())) + ); + } + updatedList = updatedList.length <=0 ? this.sortArrayRandom(projectList) : updatedList; this.setState({ filterList: updatedList }); } @@ -89,8 +93,8 @@ export default class CardsContainer extends React.Component { this.inputValue = this.inputValue.trim(); this.inputValue = this.inputValue.toLowerCase(); - - this.handleFilterListUpdate(this.value); + console.log(this.inputValue); + this.handleFilterListUpdate(this.inputValue); } sortArrayRandom(array) { diff --git a/src/cra-project/components/ProjectList/css/cards-container.css b/src/cra-project/components/ProjectList/css/cards-container.css index 62230e8..a31e791 100644 --- a/src/cra-project/components/ProjectList/css/cards-container.css +++ b/src/cra-project/components/ProjectList/css/cards-container.css @@ -1,5 +1,5 @@ .containerLayout{ - background: #f7f7fc; + background: #000000; display: flex; flex-wrap: wrap; justify-content: center; diff --git a/src/cra-project/components/ProjectList/css/project-cards.css b/src/cra-project/components/ProjectList/css/project-cards.css index 67139d5..37a0171 100644 --- a/src/cra-project/components/ProjectList/css/project-cards.css +++ b/src/cra-project/components/ProjectList/css/project-cards.css @@ -4,8 +4,9 @@ .Card-Header { position: relative; font-weight: bold; - background: white; + background: rgb(50, 50, 50); padding: 2%; + color: white; line-height: 18px; height: 140px; display: flex; @@ -23,21 +24,28 @@ } .Card-Body { position: relative; - background: white; + color: white; + background: rgba(49, 49, 49, 0); + height: 220px; + overflow: hidden; + display: flex; + flex-direction: column; + justify-content: space-between; } .Card-Container { overflow: hidden; width: 16%; min-width: 225px; - display: flex; + display: flexbox; margin: .5vw; - /* box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px; - -webkit-transition: box-shadow 0.1s ease-in-out; */ + box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 6px, rgba(0, 0, 0, 0.12) 0px 1px 4px; + -webkit-transition: box-shadow 0.1s ease-in-out; transition: box-shadow 0.1s ease-in-out; - background-color: #fff; - border: 1px solid #1f293740; + background-color: rgb(50, 50, 50); + border: 2px solid #4577bd; border-radius: 8px; padding: 8px; + box-shadow: 0px 6px 12px rgba(238, 238, 238, 0.774); } @media (max-width: 700px) { .Card-Container { @@ -73,10 +81,13 @@ .Card-Description { position: relative; padding: 5%; - max-height: 180px; - overflow: auto; + max-height: 120px; + overflow: hidden; margin-top: 16px; margin-bottom: 16px; + overflow-y: auto; + overflow-x: auto; + text-overflow: ellipsis; } .Card-Description::-webkit-scrollbar { width: 6px; @@ -97,11 +108,13 @@ .Card-Link { position: relative; padding: 15px; - color: #0f3cef; + color: #f2f4ff; background: transparent; transition: .5s; margin-top: auto; - border-top: rgba(0, 0, 0, 0.12) 1px solid; + border-top: rgb(255, 249, 249) 1px solid; + border: 2px solid #6a86f8; + border-radius: 8px; } .Card-Link:hover { color: whitesmoke; diff --git a/src/cra-project/components/ProjectList/css/search.css b/src/cra-project/components/ProjectList/css/search.css index 9360252..ff51400 100644 --- a/src/cra-project/components/ProjectList/css/search.css +++ b/src/cra-project/components/ProjectList/css/search.css @@ -1,5 +1,5 @@ #container { - background: #f7f7fc; + background: #0a0a0a; display: flex; align-items: center; justify-content: space-around; @@ -14,6 +14,7 @@ font-size: 15px; text-align: center; border: 1px solid #DCDCDC; + border-radius: 8px; } #search:hover,#search:focus { @@ -22,6 +23,7 @@ .inputContainer { width: 47%; + height: 30px; margin-top: 40px; }