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.

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

Create and style the "Interested in working together?" block #42

Open
AliHassan7 opened this issue May 11, 2017 · 6 comments
Open

Create and style the "Interested in working together?" block #42

AliHassan7 opened this issue May 11, 2017 · 6 comments

Comments

@AliHassan7
Copy link
Contributor

AliHassan7 commented May 11, 2017

  • To begin working on this task, create a branch based off of the currently checked out branch using the following convention: proj-me-initials-42
  • For your convenience, an image of the design has been added to the bottom of this issue.
  • Before working on this task, ensure that you have successfully downloaded Drupal Console by completing this short task: Install Drupal Console
  • This task involves creating a custom block that will be placed inside our custom proj_me_core custom module. Ensure that you have already created the custom module from the following task: Create a custom module using the Drupal Console
  • Let us use the Drupal console to create a custom block which will contain HTML for the "Interested in working together?" block!
    • Inside of vagrant and in proj-me, run the following command to create a custom block using Drupal Console: vendor/drupal/console/bin/drupal generate:plugin:block.
    • First question that the Drupal Console will ask you is "Enter the module name". Drupal Console is asking which module you want to put this custom block in. We want to put this custom block in our custom module that we created in the task mentioned earlier, so answer this question by typing the modules machine name: proj_me_core.
    • Enter the plugin class name: CallToAction
    • Enter the plugin label: Call To Action Block
    • Enter the plugin id (this is asking if you want to assign an id to the block): call_to_action_block
    • Enter the theme region to render the Plugin Block: (Just hit Enter on your keyboard and it'll go to the next question)
    • Do you want to load services from the container: no
    • Do you want to generate a form structure: no
    • Do you confirm generation: yes
    • You have successfully created a custom block inside of a custom module. How impressive is that!
  • To place your block in the footer region, navigate to Structure » Block Layout and place it in the footer region. (Under footer region, click on Place block and Search for the "Call To Action" custom block).
    To see the code of your block, use your file finder to navigate to your custom module located at proj-me/web/modules/custom/proj_me_core/ and use sublime text to open the file located at src/Plugin/Block/CallToAction.php.
    • To add HTML to your custom block, place your HTML inside the single quotation marks following $build['call-to-action']['#markup'] =.
  • This task consists of Adding the "Interested in working together?" text as well as the "Let's build something awesome" button.
  • The background color of the block is #272727. The font color is #525252. The button color is #bf5829
  • Apply other SASS styling as necessary
  • Upon completion of the task, please commit and push all your work to your fork of the proj-me repository. You do not need to export your configuration for this task. Remember to create a pull request.
  • Leave a comment on this issue when you:
    • Start working on this task
    • Have a question about this task
    • Complete this task (please comment on this task with a link to your pull request).
@AliHassan7
Copy link
Contributor Author

debug - homepage

@ByronGary
Copy link

working

@ByronGary
Copy link

finished #74

@ByronGary
Copy link

The background wouldn't go the whole 100% of the page width. I'm not sure what is overriding the css for this section

@msheikh12
Copy link
Contributor

started working

@msheikh12
Copy link
Contributor

completed #81

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants