studygB.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="studyGroups.css"/>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <title id="title">Study Groups</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
  </head>

  <body>
    <!-- Navbar -->
    <nav class="navbar navbar-expand-md navbar-dark bg-dark">
        <img src="logo.jpg" width="35" height="40" class="nav navbar-nav navbar-logo mx-auto rounded" alt="">
        <a class="navbar-brand" href="index.html">
            &nbsp&nbsp POLARPALS
        </a>
        <div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
            <div class="btn-group" role="group" aria-label="First group">
              <a href="index.html" class="btn btn-secondary" role="button" aria-pressed="true">
                <svg class="bi bi-house" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                    <path fill-rule="evenodd" d="M2 13.5V7h1v6.5a.5.5 0 00.5.5h9a.5.5 0 00.5-.5V7h1v6.5a1.5 1.5 0 01-1.5 1.5h-9A1.5 1.5 0 012 13.5zm11-11V6l-2-2V2.5a.5.5 0 01.5-.5h1a.5.5 0 01.5.5z" clip-rule="evenodd"/>
                    <path fill-rule="evenodd" d="M7.293 1.5a1 1 0 011.414 0l6.647 6.646a.5.5 0 01-.708.708L8 2.207 1.354 8.854a.5.5 0 11-.708-.708L7.293 1.5z" clip-rule="evenodd"/>
                </svg>
              </a>
            </div>
            <div class="btn-group mr-2" role="group" aria-label="Second group">
              <a href="studygB.html" class="btn btn-secondary active" role="button" aria-pressed="true">
                <svg class="bi bi-people" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                    <path fill-rule="evenodd" d="M15 14s1 0 1-1-1-4-5-4-5 3-5 4 1 1 1 1h8zm-7.995-.944v-.002.002zM7.022 13h7.956a.274.274 0 00.014-.002l.008-.002c-.002-.264-.167-1.03-.76-1.72C13.688 10.629 12.718 10 11 10c-1.717 0-2.687.63-3.24 1.276-.593.69-.759 1.457-.76 1.72a1.05 1.05 0 00.022.004zm7.973.056v-.002.002zM11 7a2 2 0 100-4 2 2 0 000 4zm3-2a3 3 0 11-6 0 3 3 0 016 0zM6.936 9.28a5.88 5.88 0 00-1.23-.247A7.35 7.35 0 005 9c-4 0-5 3-5 4 0 .667.333 1 1 1h4.216A2.238 2.238 0 015 13c0-1.01.377-2.042 1.09-2.904.243-.294.526-.569.846-.816zM4.92 10c-1.668.02-2.615.64-3.16 1.276C1.163 11.97 1 12.739 1 13h3c0-1.045.323-2.086.92-3zM1.5 5.5a3 3 0 116 0 3 3 0 01-6 0zm3-2a2 2 0 100 4 2 2 0 000-4z" clip-rule="evenodd"/>
                </svg>
              </a>
              <a href="textbA.html" class="btn btn-secondary" role="button" aria-pressed="true">
                <svg class="bi bi-book" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
                    <path fill-rule="evenodd" d="M3.214 1.072C4.813.752 6.916.71 8.354 2.146A.5.5 0 018.5 2.5v11a.5.5 0 01-.854.354c-.843-.844-2.115-1.059-3.47-.92-1.344.14-2.66.617-3.452 1.013A.5.5 0 010 13.5v-11a.5.5 0 01.276-.447L.5 2.5l-.224-.447.002-.001.004-.002.013-.006a5.017 5.017 0 01.22-.103 12.958 12.958 0 012.7-.869zM1 2.82v9.908c.846-.343 1.944-.672 3.074-.788 1.143-.118 2.387-.023 3.426.56V2.718c-1.063-.929-2.631-.956-4.09-.664A11.958 11.958 0 001 2.82z" clip-rule="evenodd"/>
                    <path fill-rule="evenodd" d="M12.786 1.072C11.188.752 9.084.71 7.646 2.146A.5.5 0 007.5 2.5v11a.5.5 0 00.854.354c.843-.844 2.115-1.059 3.47-.92 1.344.14 2.66.617 3.452 1.013A.5.5 0 0016 13.5v-11a.5.5 0 00-.276-.447L15.5 2.5l.224-.447-.002-.001-.004-.002-.013-.006-.047-.023a12.582 12.582 0 00-.799-.34 12.96 12.96 0 00-2.073-.609zM15 2.82v9.908c-.846-.343-1.944-.672-3.074-.788-1.143-.118-2.387-.023-3.426.56V2.718c1.063-.929 2.631-.956 4.09-.664A11.956 11.956 0 0115 2.82z" clip-rule="evenodd"/>
                </svg>
              </a>
            </div>
        </div>
        
      
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
      
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
      
          <ul class="navbar-nav ml-auto">
      
            <li class="nav-item dropdown active">
                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                  Polar Bear
                </a>
                <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
                    <a class="dropdown-item" href="profile.html">Manage Profile</a>
                </div>
            </li>
          </ul>
        </div>
      </nav>
      <br>

    <!-- Page Header-->
    <p class="parafo"><b>STUDY GROUPS</b></p>

    <!-- Main content-->
    <div class="container-fluid">
        <div class="row">

            <!-- Listings box -->
            <div class="col-sm-7 scroll">
                <div class="card bg-light text-dark">
                    <div class="card-header">
                        <div class="btn-group dropright">
                            <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                Select Class
                            </button>
                            <button type="button" class="btn btn-primary disabled">CSCI 3715</button>
                            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                <a class="dropdown-item" href="studygA.html">ECON 1101</a>
                                <a class="dropdown-item" href="studygB.html">CSCI 3715</a>
                                <a class="dropdown-item" href="studygC.html">SOC 1101</a>
                                <a class="dropdown-item" href="studygD.html">VART 2101</a>
                                <a class="dropdown-item" href="#">All</a>
                                <div class="dropdown-divider"></div>
                                <a class="dropdown-item" href="#">Add course</a>
                            </div>
                        </div>

                        <div class="btn-group float-right">
                            <button type="button" class="btn btn-secondary dropdown-toggle float-right" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                Filter
                            </button>
                            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
                                <a class="dropdown-item" >Saved Posts</a>
                                <a class="dropdown-item" >All Posts</a>
                            </div>
                        </div>
                    </div>

                    <div class="card-body">
                        <div class="card-columns">
                            <div class="card" style="width: 16rem;">
                                <div class="card-body">
                                    <h5 class="card-title">HCI study group anyone?</h5>
                                    <h6 class="card-subtitle mb-2 text-muted">Phuong Luong</h6>
                                    <p class="card-text">So we have a midterm coming up for this class, and idk about you guys but I'm not ready.</p>
                                    <p class="card-text"><small class="text-muted">Last updated 5 mins ago</small></p>
                                    <a href="studyPostPhuong.html" class="card-link">View Post</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                </div> 
            </div>

            <!-- Forms box accordion-->
            <div class="col-sm-5 scroll">
                <div id="accordion">
                    <div class="card">
                        <div class="card-header" id="headingTwo">
                            <h5 class="mb-0">
                                <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                    Make A Post
                                </button>
                            </h5>
                        </div>
                        <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
                            <div class="card-body">
                                <form>
                                    <div class="form-group row">
                                      <label for="courseSelect1" class="col-sm-2 col-form-label">Course</label>
                                      <div class="col-sm-10">
                                        <select class="form-control" id="courseSelect1">
                                            <option>CSCI 3715</option>
                                            <option>ECON 1101</option>
                                            <option>SOC 1101</option>
                                            <option>VART 2101</option>
                                        </select>
                                      </div>
                                    </div>
                                    <div class="form-group row">
                                      <label for="postDescription" class="col-sm-2 col-form-label">Title</label>
                                      <div class="col-sm-10">
                                        <input type="title" class="form-control" id="postDescription" placeholder="Group name, purpose, or something else">
                                      </div>
                                    </div>
                                    <fieldset class="form-group">
                                      <div class="row">
                                        <legend class="col-form-label col-sm-2 pt-0">Post creator</legend>
                                        <div class="col-sm-10">
                                          <div class="form-check">
                                            <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios1" value="option1" checked>
                                            <label class="form-check-label" for="gridRadios1">
                                              Use profile full name
                                            </label>
                                          </div>
                                          <div class="form-check">
                                            <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios2" value="option2">
                                            <label class="form-check-label" for="gridRadios2">
                                              Use preferred name
                                            </label>
                                          </div>
                                          <div class="form-check">
                                            <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios3" value="option3">
                                            <label class="form-check-label" for="gridRadios3">
                                              Be anonymous
                                            </label>
                                          </div>
                                        </div>
                                      </div>
                                    </fieldset>
                                    <div class="form-group row">
                                        <label for="postDescription" class="col-sm-2 col-form-label">Details</label>
                                        <div class="col-sm-10">
                                            <textarea class="form-control" id="postDescription" rows="3" placeholder="Consider study goals, frequency, location, time, materials, etc. Don't include sensitive information, and please be respectful."></textarea>
                                        </div>
                                    </div>
                                    <div class="form-group row">
                                      <div class="col-sm-2">Optional</div>
                                      <div class="col-sm-10">
                                        <div class="form-check">
                                          <input class="form-check-input" type="checkbox" id="gridCheck1">
                                          <label class="form-check-label" for="gridCheck1">
                                            Include your class year
                                          </label>
                                        </div>
                                      </div>
                                    </div>
                                    <div class="form-group row">
                                      <div class="col-sm-10">
                                        <button type="submit" class="btn btn-primary">Post</button>
                                      </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- bottom stuffs (fixed bottom)-->
    <div class="container-fluid">
        <div class="card bg-dark text-light fixed-bottom">
            <div class="card-body">

                <ul class="nav">
                  <li class="nav-item">
                    <a class="nav-link text-white" href="about.html">About Us</a>
                  </li>
                  <li class="nav-item">
                    <a class="nav-link text-white" href="alpha.html">Contact Us</a>
                  </li>
                  <li class="nav-item">
                    <a class="nav-link text-white" href="alpha.html">FAQs</a>
                  </li>
                  <li class="nav-item">
                    <a class="nav-link text-white" href="alpha.html">Help</a>
                  </li>
                  <li class="nav-item">
                    <a class="nav-link text-white" href="https://www.bowdoin.edu/">Bowdoin Resources</a>
                  </li>
                  <li class="nav-item">
                    <a class="nav-link text-white" href="https://www.bowdoin.edu/covid-19/index.html">COVID-19 FAQs</a>
                  </li>
                  <li class="nav-item ml-auto">
                    <a class="nav-link disabled text-muted">TechTelligence Co.</a>
                  </li>
                </ul>

            </div>
        </div>
    </div>
  </body>
</html>