0x21-consulting / thriver Goto Github PK

View Code? Open in Web Editor NEW

6.0 4.0 2.0 71.47 MB

Thriver, a Content Management System for Nonprofit Organizations

License: MIT License

CSS 27.89% HTML 16.71% JavaScript 55.39%

cms nonprofit-organizations non-profit nonprofit meteor meteorjs boards events governance engagement

thriver's People

Contributors

Stargazers

Watchers

Forkers

charitablehumans santoshsrinivas79

thriver's Issues

Create NoSLB API

Create an API for NoSLB that will allow features to register methods without worrying about race conditions.

Email Verification Styles

When a user verifies their email address, a popup appears showing their email has been verified. We need to style this section.

The section appears as the first child under <body>. Here's the markup:

<div class="accounts-dialog accounts-centered-dialog">
    Email verified.
    You are now logged in as ********@gmail.com.
    <div class="login-button" id="just-verified-dismiss-button">Dismiss</div>
</div>

Styles currently applied to the whole section:

** login_buttons.import.less:342 **
.accounts-centered-dialog {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    z-index: 1001;
    position: fixed;
    left: 50%;
    margin-left: -129px;
    top: 50%;
    margin-top: -40px;
}

** login_buttons.import.less:234 **
.accounts-dialog {
    border: 1px solid #cccccc;
    z-index: 1000;
    background: white;
    border-radius: 4px;
    padding: 8px 12px;
    margin: -8px -12px 0 -12px;
    width: 250px;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
    font-size: 16px;
    color: #333;
}

Styles currently applied to child "Dismiss" button:

** login_buttons.import.less:389 **
#just-verified-dismiss-button, #messages-dialog-dismiss-button {
    margin-top: 8px;
}

** login_buttons.import.less:153 **
.accounts-dialog .login-button {
    width: auto;
    margin-bottom: 4px;
}

** login_buttons.import.less:99 **
#login-buttons .login-button, .accounts-dialog .login-button {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    padding: 4px 8px;
    font-size: 80%;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    line-height: 1.5;
    text-align: center;
    color: #fff;
    background: #596595;
    border: 1px solid #464f75;
    border-radius: 4px;
}

** login_buttons.import.less:256 **
.accounts-dialog > * {
    line-height: 1.6;
}

** login_buttons.import.less:133 **
.accounts-dialog * {
    padding: 0;
    margin: 0;
    line-height: inherit;
    color: inherit;
    font: inherit;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

On donate, submit button doesn't disable

When submitting the donate form, the submit doesn't disable, allowing for accidental duplicate submissions.

Notifications icon doesn't show numbers

Just shows the exclamation icon, hex  I think it should show the number of notifications, unless you disagree. If so, I can add a dataset property for an ::after psuedo-element, or connect the number in the template directly.

Shift in Navigation Text on 'fixedHeader' class animation on displays @ < 1450

Add 'Show All' Link to Find by Zip or Find by County

Fix smooth scroll jitter

At times, clicking a link will cause a stutter before the smooth scroll appears. It's almost as if the page relocates to that location of the destination, then back in less than half a second before beginning the smooth scroll.

Enhance Open Parent Background state in newsroom

Location bar updates no longer accurate

Location bar URI updates no longer update accurately. There seems to be some very large offset, perhaps at 1000px or greater.

What We Do Section missing some formatting

In the What We Do section, it looks like <h3> elements have no top margin, and <li> elements have no bullet point. That's what's causing the formatting to look a bit off. In reality, some of the sections are actually well-formed from markdown, such as the Advocacy page; it just doesn't look like it because of some missing styles.

Tabs sometimes result in incorrect class assignment

Tabs sometimes result in incorrect class assignment on click of area of tab.

Question: URL & Nav Active Class on Scroll: Can it change based on a percentage?

Ideally I think the URL and nav active class would change as a section takes over 50% of the viewport.
However not sure if that's possible.

Providers Section leaving previous county's selection if a new county is selected with multiple available locations

React to location bar changes

If the hash value in the URI in the browser's location bar changes, prevent the page from reloading and smooth scroll to the respective location.

Improving the Navigation Page Transitions

This is something we should talk about.
Is scrolling to a section the best method?
Or could it be better if say it faded in/out?

If scrolling is the answer:
Observing a flicker of the section it is to scroll to occasionally.
Can we modify the easing of that effect?

Child Pages in Work Section: Headlines should carry over icon from parent.

Replace Static Login/Logout & Notifications Content with real data

There are templates all over for these sections, but the content is missing. Also, it looks like quite a bit of the content in these sections are static. I'd like to start building user profiles.

Create an easy editor for section content

Staff members aren't very keen on writing markdown for sections. Help them out with some compromised interface that allows for some WYSIWYG elements without causing additions of poor code and without incurring a buggy and unpredictable interface.

Show All button in Provider section

Please create a show all button in the Providers section that will cause the map to zoom out and display all providers for the state.

Email Verification

When a user's email address gets verified by them following a link sent to them in an email, we need to somehow convey to the user that the email has been verified successfully.

Disabled buttons should be visibly disabled

CSS rules should be in place for letting the user know that a button is disabled and may not be clicked. This includes the following:

<button>
<input type="submit" />

The following templates may contain disabled buttons at any given time:

register
login
profile
donate

Complete 'Get Help' Utility LI click event

We need to complete the event for the 'Get Help' button in the utility navigation.
@micchickenburger , was hoping you could help.

Visible on line 55-61 in utility.js:
'click li.getHelp': closeAsides, 'click li.getHelp': function (event) { location.href='/#service-providers'; $('figure.alert').addClass('active').delay(5000).queue(function(){ $(this).removeClass("active").dequeue(); }); }

We need to scroll down the page to #service-providers and display an alert with content.
Alerts have their own module where their template can be referenced.

Register Error Element needs to be removed from source code

Line 6 of account_register.html reads:
<p id="register-error" style="display:none;"></p>

I've added a display:none to this element temporarily.
It needs to only be only placed in the markup if error=true.
Then of course we can remove the inline style.

Alternatively it needs to have a class added to the element if error=true, that way I can hide the element unless error=true.

Clean up /public/lib/img/

Create textBody Styles

To be used in such sections as news articles and large content editable areas such as work.

Update URL as Page Scrolls

Add Print Support

CSS required for print in addition to singular print icon styles.

Cross-Browser validation

Perform cross-browser testing to ensure compatibility with:

IE 9, 10, 11
Edge
Firefox
Safari
Chrome

Submitting login form with no fields input results in the #login-error to appear with empty content.

Log in section display issues

The drop down doesn't close unless the close button is pressed. It should close automatically if the user clicks outside of the box.
The drop down is hidden behind the donate section.
When logged in, the close button appears only partially on top of the logged-in user's email address.

Donation Error Messages

Fields with errors now highlight after form submission; however, they look terrible. The color of the inset box shadow on the error fields should reflect the brand. Furthermore, the error messages are ::after pseudo elements on error field parent nodes since input elements cannot contain pseudo elements and I think error messages should be adequately presented near the problem fields. My current solution has some display problems, as you can see in the screenshot. Particularly, error messages on the expiration or cvv2 fields cover the submit button because those fields are floating. I tried to clear the float, as well as the overflow:auto; hack, but neither resolve the problem.

Investigate Scrollbar behind UL in sidebars

Revisit Favicon

Donate section doesn't resize

The donate section can be too large for some displays, requiring a scroll. I don't think this should be the case.

Require Content Verbiage for "Get Help" Alert

When user selects "Get Help" from the utility navigation: the page is to scroll to the "Providers" section. In addition to this: an alert is displayed for the user reading something such as:
"If this is an emergency please dial 911. Please use our provider locator to find the nearest available help center."

We need to acquire or create the appropriate verbiage for this alert.

Clicking Twitter & Notifications icons do not close respective elements

Clicking the Twitter icon will open the twitter feed, but clicking it again won't close it. Same goes for notifications element.

Tab/Shift+Tab Focus Needs UX

Seems tabbing through a sidebar form field for instance can completely dismantle the UI.

Add Current Class to Scrolled/Selected Main Nav List Item & Section

Let's add an 'current' class to a selected section via the navigation or as it is scrolled through.

Require Original Art Asset for Logos

Currently the logo file being used was doctored by me because the PDF was rendering some errors in transparency.

Can we get a copy of all logo asset files in either an AI or EPS file format?

Question: Is it possible to prevent the favicon from flickering to the page icon on Chrome as you scroll between sections?

Generic Notification Links

Generic notifications should link to their hrefs somehow. For instance, if an action alert is added, the user should be able to click the corresponding notification to view the action alert. The notification already receives this information in the url attribute; we just need the front-end to inform the user somehow that it's clickable.

Modularize "template components"

Template components, like the Donate, work, callout, and community sections should be modularized into their own folders. In that way they may eventually register themselves to new API features, which I anticipate will be required in order for the "Complete Location and History Support" milestone to complete.

People summaries in Who section unaligned

The bubble summaries in the who-we-are section do not properly align with one another.

Edit name fields work, but don't show current name

When logged in as a site admin, the edit name fields for article sections don't display the section's name if that section is a sub-section.

Staff & BoD Sections Display Problems

Active state appearing on newsroom tabs when selecting

Add Vendor Prefix to All Animations

Currently only configured for Chrome.

Hover effect on various input fields is inconsistent

The hover effect established by the following code does not apply to email, search, or password input fields, which can make the hover effect feel inconsistent, such as in the profile tab under Account Details.

form .styledSelect:hover, form .cvv2:hover, form input[type=text]:hover {
    background-color: #4c5d67;
}

Furthermore, disabled fields should not have a hover effect.

<input type="text" value="Text" disabled />  <!-- Don't allow user to edit -->

Fixed Navigation detection is delayed

I understand we needed to implement a solution to prevent bubbling on the scroll action to detect if the fixed nav class should be added. However from an animation perspective, adding that fixed nav class right away is essential for a better UX.

Is there a way we can make that class added sooner? Perhaps on some type of "scroll initialized" function?