Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update landing page features #131

Closed
wants to merge 1 commit into from
Closed

Update landing page features #131

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
141 changes: 114 additions & 27 deletions src/ctree-app/ctree-landing.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -377,6 +377,27 @@
#copyright p {
font-size: .8em;
}
div .features-content {
margin: 0 45px;
}
div .collaboration-search-col, div .share-review-col {
margin: auto;
width: 90%;
}
div #features h3 {
font-size: 1.25em;
}
div #features p {
font-size: 1.12em;
}
div .collaboration-section, div .search-section,
div .share-section, div .review-section, div .features-content {
display: block;
}
div .image {
margin-right: 0;
}

}

/* Section CSS Styling */
Expand All @@ -395,6 +416,13 @@
#features.section-styling {
background-color: #FFFFFF;
color: #196848;
padding-top: 65px;
margin-top: -65px; /* app-header fix */
}
#features h1 {
color: #62A374;
font-size: 2.9em;
letter-spacing: .02em;
}
#ctree.section-styling {
background-color: #196848;
Expand Down Expand Up @@ -456,6 +484,39 @@
color: #000000;
display: flex;
}
iron-icon {
--iron-icon-fill-color: #62A374;
--iron-icon-width: 80px;
--iron-icon-height: 80px;
}
#features h3 {
color: #62A374;
margin-top: 0;
}
#features p {
color: #222322;
font-size: 0.75em;
letter-spacing: .027em;
padding-top: 10px;
}
.collaboration-search-col, .share-review-col {
width: 350px;
}
.features-content {
display: flex;
justify-content: space-evenly;
}
.collaboration-section, .search-section, .share-section, .review-section {
display: flex;
margin-bottom: 50px;
}
.image {
margin-right: 50px;
}
.review {
transform: rotate(40deg);
}

</style>

<iron-meta key="rootPath" value="{{rootPath}}"></iron-meta>
Expand Down Expand Up @@ -533,33 +594,59 @@
<p>W</p>
</div>
<div id="features" class="section-styling">
<div class= "center-div">
<h1 align="center">Features</h1>
<hr id="features-horizontal-line"/>
<!-- grid layout to be added here with icons and descriptions. -->
</div>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
<p>W</p>
</div>
<h1 align="center">Features</h1>
<!-- grid layout to be added here with icons and descriptions. -->
<div class="features-content">
<div class="collaboration-search-col">
<div class="collaboration-section">
<div class="image">
<iron-icon icon="collaboration"></iron-icon>
</div>
<div class="collaboration-text">
<h3>Collaboration</h3>
<p>
Connect with like-minded passionate individuals to solve problems for a cause.
</p>
</div>
</div> <!-- end of collaboration section -->
<div class="search-section">
<div class="image">
<iron-icon icon="search"></iron-icon>
</div>
<div class="search-text">
<h3>Search</h3>
<p>
Discover non-profits and other causes doing good for the world!
</p>
</div>
</div> <!-- end of search section -->
</div> <!-- end of collaboration-search column -->
<div class="share-review-col">
<div class="share-section">
<div class="image">
<iron-icon icon="share"></iron-icon>
</div>
<div class="share-text">
<h3>Share</h3>
<p>
Promote other helpful thoughts and discussions to avoid seeing the same answers over and over again
</p>
</div>
</div> <!-- end of share section -->
<div class="review-section">
<div class="image">
<iron-icon class="review" icon="review"></iron-icon>
</div>
<div class="review-text">
<h3>Review</h3>
<p>
Edit and Vote for the most helpful version of ideas and solutions
</p>
</div>
</div> <!-- end of review section -->
</div><!-- end of share-review column -->
</div> <!-- end of features-content -->
</div> <!-- end of section-styling -->
<div id="ctree" class="section-styling">
<p>W</p>
<p>W</p>
Expand Down
3 changes: 3 additions & 0 deletions src/ctree-app/icons.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,5 +46,8 @@
<g id="settings"><path d="M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49 1c-.52-.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l-.38 2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64l2.11 1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4 1.08.73 1.69.98l.38 2.65c.03.24.24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49 1c.23.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM12 15.5c-1.93 0-3.5-1.57-3.5-3.5s1.57-3.5 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z"></path></g>
<g id="suggested"><path d="M13.5.67s.74 2.65.74 4.8c0 2.06-1.35 3.73-3.41 3.73-2.07 0-3.63-1.67-3.63-3.73l.03-.36C5.21 7.51 4 10.62 4 14c0 4.42 3.58 8 8 8s8-3.58 8-8C20 8.61 17.41 3.8 13.5.67zM11.71 19c-1.78 0-3.22-1.4-3.22-3.14 0-1.62 1.05-2.76 2.81-3.12 1.77-.36 3.6-1.21 4.62-2.58.39 1.29.59 2.65.59 4.04 0 2.65-2.15 4.8-4.8 4.8z"></path></g>
<g id="clear"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path></g>
<g id="collaboration"><path d="M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"></path></g>
<g id="share"><path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92s-1.31-2.92-2.92-2.92z"></path></g>
<g id="review"><path d="M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z"></path></g>
</defs></svg>
</iron-iconset-svg>