Created DataInterface class to handle disparate data classes.

master
chir0taur 5 months ago
parent 2df22af386
commit d6444c213f
  1. 407
      php/index.php
  2. 407
      php/out.css
  3. 0
      php/polls.db
  4. BIN
      php/qs36f.db

@ -12,6 +12,10 @@
* - qs36f/pollresp (id, pollid, pollqid, pollansid, datetime)
*/
/**
* Handles queries and errors for database.
* @param $connection - the database connection
*/
class DBConnector
{
private $connection;
@ -21,51 +25,149 @@ class DBConnector
$this->connection = $connection;
}
public function query($sql)
/**
* Performs a query on the database.
* @param string $sql - the text of the query to perform
* @return Result - the result of the query
*/
public function query(string $sql)
{
if (!$result = $this->connection->query($sql)) {
$this->doError(__FUNCTION__, $sql);
$this->doError(get_class($this), __FUNCTION__, $sql);
}
return $result;
}
/**
* Fetches the next row from the result set.
* @param $result - the result set to fetch from
* @return array - the next row from the result set
*/
public function fetchArray($result)
{
return $result->fetchArray(SQLITE3_ASSOC);
}
/**
* Returns the last error code.
* @return string - the last error code
*/
public function lastErrorCode()
{
return $this->connection->lastErrorCode();
}
/**
* Returns the last error message.
* @return string - the last error message
*/
public function lastErrorMsg()
{
return $this->connection->lastErrorMsg();
}
public function doError($function, $sql)
/**
* Shows error in browser, closes db connection, and terminates program.
* @param string $function - the calling function
* @param string $sql - the sql query that caused the error
*/
public function doError($class, $function, string $sql)
{
echo ("<p><b>Error in $function: " . $this->lastErrorCode() . "</b></p>
<p><b>" . $this->lastErrorMsg() . "</b></p>
<p><b>$sql</b></p>
");
// $sql = '';
if ($class != '') {
echo ("<p><b>Error in $class class, $function function. Error #:" .$this->lastErrorCode() . "</b></p>
<p><b>Error message: " . $this->lastErrorMsg() . "</b></p>
<p><b>$sql</b></p>
");
} else {
echo ("<p><b>Error in $function: " . $this->lastErrorCode() . "</b></p>
<p><b>" . $this->lastErrorMsg() . "</b></p>
<p><b>$sql</b></p>
");
}
$this->connection->close();
exit();
}
public function lastInsertRowID() {
return $this->connection->lastInsertRowID();
}
}
class DataInterface {
private DBConnector $db;
private array $polls;
private array $question_types;
public function __construct() {
$this->db = new DBConnector(new SQLite3('qs36f.db'));
$this->configurePolls();
$this->configureQuestionTypes();
}
private function configurePolls() {
$sql = "SELECT * FROM polls";
if (!$result = $this->db->query($sql)) $this->db->doError(get_class($this), __FUNCTION__, $sql);
while ($row = $this->db->fetchArray($result)) {
$this->polls[$row['id']] = new Poll($this->db, $row['id']);
}
}
private function configureQuestionTypes() {
$sql = "SELECT * FROM pollqtypes";
if (!$result = $this->db->query($sql)) $this->db->doError(get_class($this), __FUNCTION__, $sql);
while ($row = $this->db->fetchArray($result)) {
$this->question_types[] = new QuestionType($row['id'], $row['descrip'], $row['created']);
}
}
public function createNewPoll(string $description, $username) {
$sql = "INSERT INTO polls (descrip, username, published, updated) VALUES ('$description', '$username', " . date('YmdHis') . ", " . date('YmdHis') . ")";
if (!$result = $this->db->query($sql)) $this->db->doError(get_class($this), __FUNCTION__, $sql) ;
$this->polls[] = new Poll($this->db, $this->db->lastInsertRowID());
}
public function getPolls() {
return $this->polls;
}
public function getPoll($id) {
$sql = "SELECT * FROM polls p0 WHERE p0.id = $id";
if (!$result = $this->db->query($sql)) $this->db->doError(get_class($this), __FUNCTION__, $sql);
$id = $this->db->fetchArray($result)['id'];
return ($this->polls[$id]);
}
public function getQuestionTypes() {
return $this->question_types;
}
public function nextQuestionID($pollid) {
$sql = "SELECT max(id) next_id FROM pollques where pollid = $pollid";
if (!$result = $this->db->query($sql)) $this->db->doError(get_class($this), __FUNCTION__, $sql);
$next_id = $this->db->fetchArray($result)['next_id'];
if ($next_id == null) $next_id = 1;
return $next_id;
}
public function nextAnswerID($pollquesid) {
$sql = "SELECT max(id) next_id FROM pollans where pollquesid = $pollquesid";
if (!$result = $this->db->query($sql)) $this->db->doError(get_class($this), __FUNCTION__, $sql);
$next_id = $this->db->fetchArray($result)['next_id'];
if ($next_id == null) $next_id = 1;
return $next_id;
}
}
class Poll
{
private string $id;
private DBConnector $db;
private int $id;
private int $question_count;
private string $descrip;
private int $published;
private int $updated;
private array $questions;
private int $question_count;
private DBConnector $db;
public function __construct(string $id, DBConnector $db)
public function __construct(DBConnector $db, string $id)
{
$this->id = $id;
$this->db = $db;
@ -79,7 +181,7 @@ class Poll
where p0.id = " . $this->id;
if (!$result = $this->db->query($sql)) {
$this->db->doError(__FUNCTION__, $sql);
$this->db->doError(get_class($this), __FUNCTION__, $sql);
}
$row = $this->db->fetchArray($result);
@ -88,102 +190,146 @@ class Poll
$this->published = $row['published'];
$this->updated = $row['updated'];
$this->getQuestions();
$this->configureQuestions();
}
private function getQuestions()
private function configureQuestions()
{
$sql = "SELECT * FROM pollques p0
$sql = "SELECT id FROM pollques p0
where p0.pollid = " . $this->id;
if (!$result = $this->db->query($sql)) {
$this->db->doError(__FUNCTION__, $sql);
$this->db->doError(get_class($this), __FUNCTION__, $sql);
}
$row = $this->db->fetchArray($result);
$this->questions = array();
while ($row = $this->db->fetchArray($result)) {
$this->questions[] = new PollQuestion($row['id'], $this->id, $row['question'], $this->db);
$this->questions[] = new PollQuestion($this->db, $row['id']);
$this->question_count = $this->question_count + 1;
}
}
public function questions()
{
return $this->questions;
public function getID() {
return $this->id;
}
public function descrip()
public function getQuestions()
{
return $this->descrip;
return $this->questions;
}
public function id()
public function getDescrip()
{
return $this->id;
return $this->descrip;
}
public function published()
{
return $this->published;
public function getUpdatedData() {
return $this->updated;
}
public function updated()
{
return $this->updated;
public function getUpdatedPrint() {
echo "<script>console.log($this->updated);</script>";
// Convert YYYYMMDDHHMMSS to DD/MM/YYYY HH:MM:SS
$datetime = $this->updated;
$convertedDateTime = substr($datetime, 6, 2) . "/" . substr($datetime, 4, 2) . "/" . substr($datetime, 0, 4) . " " . substr($datetime, 8, 2) . ":" . substr($datetime, 10, 2) . ":" . substr($datetime, 12, 2);
return $convertedDateTime;
}
}
class PollQuestion
{
private $id;
private $pollid;
private $question;
private array $answers;
private DBConnector $db;
private int $id;
private int $pollid;
private string $question;
private int $type;
private int $published;
private int $updated;
private array $answers;
public function __construct($id, $pollid, $question, DBConnector $db)
public function __construct(DBConnector $db, int $id)
{
$this->db = $db;
$this->id = $id;
$this->pollid = $pollid;
$this->question = $question;
$this->answers = array();
$this->configureSelf();
}
private function configureSelf()
{
$sql = "SELECT * FROM pollans p0
where p0.pollid = " . $this->pollid . "
and p0.pollquesid = " . $this->id;
if (!$result = $this->db->query($sql)) {
$this->db->doError(__FUNCTION__, $sql);
}
$sql = "SELECT * FROM pollques p0
where p0.id = " . $this->id;
if (!$result = $this->db->query($sql)) { $this->db->doError(get_class($this), __FUNCTION__, $sql); }
$row = $this->db->fetchArray($result);
$this->pollid = $row['pollid'];
$this->question = $row['question'];
$this->type = $row['type'];
$this->published = $row['published'];
$this->updated = $row['updated'];
$this->answers = array();
$sql = "SELECT id FROM pollans p0
where p0.pollquesid = " . $this->id;
if (!$results = $this->db->query($sql)) { $this->db->doError(get_class($this), __FUNCTION__, $sql); }
$row = $this->db->fetchArray($result);
while ($row = $this->db->fetchArray($result)) {
$this->answers[] = new PollAnswer($row['id'], $this->pollid, $this->id, $row['answer'], $row['totlvotes']);
$this->answers[] = new PollAnswer($this->db, $row['id']);
}
}
public function getQuestion() {
return $this->question;
}
public function getAnswers() {
return $this->answers;
}
}
class QuestionType {
private int $id;
private string $descrip;
private int $created;
public function __construct(int $id, string $descrip, int $created)
{
$this->id = $id;
$this->descrip = $descrip;
$this->created = $created;
}
public function getDescrip() {
return $this->descrip;
}
public function getCreated() {
return $this->created;
}
}
class PollAnswer
{
private $id;
private $pollid;
private $pollquesid;
private $answer;
private $totlvotes;
public function __construct($id, $pollid, $pollquesid, $answer, $totlvotes)
private DBConnector $db;
private int $id;
private int $pollid;
private int $pollquesid;
private string $answer;
private int $totlvotes;
private int $voterank;
public function __construct(DBConnector $db, int $id)
{
$this->db = $db;
$this->id = $id;
$this->pollid = $pollid;
$this->pollquesid = $pollquesid;
$this->answer = $answer;
$this->totlvotes = $totlvotes;
$sql = "SELECT * FROM pollans p0
where p0.id = " . $this->id;
if (!$result = $this->db->query($sql)) { $this->db->doError(get_class($this), __FUNCTION__, $sql); }
$row = $this->db->fetchArray($result);
$this->pollid = $row['pollid'];
$this->pollquesid = $row['pollquesid'];
$this->answer = $row['answer'];
$this->totlvotes = $row['totlvotes'];
$this->voterank = $row['voterank'];
}
}
@ -194,9 +340,8 @@ class Validator
private $data;
private $error;
public function __construct(DBConnector $db, $action)
public function __construct($action)
{
$this->db = $db;
$this->action = $action;
$this->error = '';
if (isset($_REQUEST['descrip'])) {
@ -226,17 +371,11 @@ class Validator
}
}
$db_conn = new SQLite3('./qs36f.db');
$db = new DBConnector($db_conn);
$sql = "SELECT * FROM polls p0";
if (!$result = $db->query($sql)) {
$db->doError(__FUNCTION__, $sql);
}
$polls = array();
while ($row = $db->fetchArray($result)) {
$polls[] = new Poll($row['id'], $db);
}
global $username;
$username = 'mcfarlandj';
$data = new DataInterface();
htmlHead();
$pf_task = getTask();
function getTask()
{
if (isset($_REQUEST['task'])) {
@ -247,25 +386,19 @@ function getTask()
return $pf_task;
}
$pf_task = getTask();
htmlHead();
$username = 'mcfarlandj';
switch ($pf_task) {
case 'default':
home($polls);
home($data);
break;
case 'createpoll':
beginCreatePoll($db);
beginCreatePoll($data);
break;
case 'Create':
endCreatePoll($db, $username);
endCreatePoll($data);
break;
case 'edit':
$id = $_REQUEST['id'];
beginEdit($id);
beginEdit($data, $id);
break;
case 'createquestion':
if (isset($_REQUEST['id'])) {
@ -277,7 +410,7 @@ switch ($pf_task) {
break;
case 'Update':
$id = $_REQUEST['id'];
endEdit($id);
endEdit($data, $id);
break;
case 'validate':
$action = $_REQUEST['action'];
@ -305,8 +438,9 @@ function htmlHead()
<?php
}
function home($polls)
function home(DataInterface $data)
{
$polls = $data->getPolls();
?>
<div id="primary_container" class=''>
<?= hero('Polls', 'An app for conducting polls!'); ?>
@ -316,11 +450,11 @@ function home($polls)
<div class='font-bold border-2 border-purple-700 w-max rounded-md'>
<div class='flex flex-col items-center'>
<div class='font-bold pb-4 bg-zinc-700 text-white p-8 pt-4 w-full text-center'>Current Polls</div>
<div class='mb-4 mt-4 flex flex-col items-center'>
<div class='mb-4 mt-4 pl-4 pr-4 flex flex-col items-center'>
<?php
if (count($polls) > 0) {
foreach ($polls as $poll) { ?>
<div class=' text-purple-900 bg-slate-100 p-1 pl-4 pr-4 text-center rounded-full w-max mb-2 mt-2 hover:bg-slate-700 hover:text-white' hx-get="./index.php?task=edit&id=<?= $poll->id() ?>" hx-push-url='index.php?task=edit&id=<?= $poll->id(); ?>' hx-target='#primary_container' hx-swap='outerHTML'><?= $poll->descrip() ?></div>
<div class=' text-purple-900 bg-slate-100 p-1 pl-4 pr-4 text-center rounded-full w-max mb-2 mt-2 hover:bg-slate-700 hover:text-white' hx-get="./index.php?task=edit&id=<?= $poll->getID() ?>" hx-push-url='index.php?task=edit&id=<?= $poll->getID(); ?>' hx-target='#primary_container' hx-swap='outerHTML'><?= $poll->getDescrip() ?></div>
<?php }
} else {
?>
@ -356,12 +490,12 @@ function hero($text, $subtext = '')
<?php
}
function submit()
function submitStyles()
{
return 'bg-purple-900 p-2 pl-4 pr-4 text-white rounded-full w-max text-center border-2 border-purple-800 hover:bg-purple-600 hover:border-purple-200';
return 'text-lg bg-purple-900 font-bold p-2 pl-4 pr-4 text-white rounded-full w-max text-center border-2 border-purple-800 hover:bg-purple-600 hover:border-purple-200';
}
function beginCreatePoll($db)
function beginCreatePoll(DataInterface $data)
{
?>
<div id="primary_container">
@ -373,10 +507,10 @@ function beginCreatePoll($db)
<div class='text-lg p-2 bg-slate-100 border-r-2 border-violet-800'>Enter a title for your poll</div>
<input class='text-lg p-2 w-[50vw] bg-slate-100 rounded-md' type="text" name="descrip" id="descrip" hx-trigger='change' hx-post='./index.php?task=validate&action=create_description' hx-target='#validation_errors' placeholder="Poll Title">
</div>
<?= validate($db, 'create_description'); ?>
<input class='<?= submit(); ?> mt-2 mb-2' type="submit" name='task' value="Create">
<?= validate('create_description'); ?>
<input class='<?= submitStyles(); ?> mt-2 mb-2' type="submit" name='task' value="Create">
<div>
<input class='<?= cancel(); ?>' type="button" value="Cancel" hx-post='./index.php' hx-target='#primary_container' hx-swap='outerHTML' hx-push-url='/'>
<input class='<?= cancelStyles(); ?>' type="button" value="Cancel" hx-post='./index.php' hx-target='#primary_container' hx-swap='outerHTML' hx-push-url='/'>
</div>
</div>
</form>
@ -385,23 +519,21 @@ function beginCreatePoll($db)
<?php
}
function validate($db, $action)
function validate(string $action)
{
new Validator($db, $action);
new Validator($action);
}
function cancel()
function cancelStyles()
{
return 'bg-slate-600 p-2 pl-4 pr-4 text-white rounded-full w-max text-center border-2 border-slate-200 hover:bg-red-600 hover:border-red-200';
return 'text-lg bg-slate-600 p-2 pl-4 pr-4 text-white rounded-full w-max text-center border-2 border-slate-200 hover:bg-red-600 hover:border-red-200';
}
function endCreatePoll(DBConnector $db, $username)
function endCreatePoll(DataInterface $data)
{
global $username;
// Write to database, using current date time in YYYYMMDDHHMMSS format for published and updated
$sql = "INSERT INTO polls (descrip, username, published, updated) VALUES ('" . $_POST['descrip'] . "', '" . $username . "', '" . date('YmdHis') . "', '" . date('YmdHis') . "')";
if (!$result = $db->query($sql)) {
$db->doError(__FUNCTION__, $sql);
}
$data->createNewPoll($_POST['descrip'], $username);
?>
<div id="primary_container">
<a href='/' class=" cursor-pointer">
@ -417,47 +549,40 @@ function endCreatePoll(DBConnector $db, $username)
<?php
}
function beginEdit($id)
function beginEdit(DataInterface $data, int $id)
{
$db_conn = new SQLite3('qs36f.db');
$db = new DBConnector($db_conn);
// Get poll data
$sql = "SELECT * FROM polls WHERE id = " . $id;
if (!$result = $db->query($sql)) {
$db->doError(__FUNCTION__, $sql);
}
$polldata = $db->fetchArray($result);
$poll = new Poll($polldata['id'], $db);
$poll = $data->getPoll($id);
$questions = $poll->questions();
$questions = $poll->getQuestions();
?>
<div id="primary_container">
<?= hero('Edit poll', $poll->descrip()); ?>
<?= hero('Edit poll', $poll->getDescrip()); ?>
<form action="./index.php" method="post">
<div class="m-4 flex flex-col items-center">
<div class='bg-slate-200 p-8 rounded-lg'>
<div class='flex border-2 border-violet-800 rounded-md bg-blue-100'>
<div class='text-lg p-2 bg-blue-200 border-r-2 border-violet-800 w-[15%] text-center'>Poll Title</div>
<input class='text-lg p-2 w-full rounded-md' type="text" name="descrip" id="descrip" hx-trigger='change' hx-post='./index.php?task=validate&action=create_description' hx-target='#validation_errors' value='<?= $polldata['descrip']; ?>'>
<div class='bg-slate-400 p-8 rounded-lg border-purple-600 border-2'>
<div class='flex border-2 border-violet-800 rounded-lg bg-blue-100'>
<div class='text-lg p-2 bg-blue-100 border-r-2 border-violet-800 w-[15%] text-center font-bold rounded-l-lg'>Poll Title</div>
<input class='text-lg p-2 w-full rounded-r-lg' type="text" name="descrip" id="descrip" hx-trigger='change' hx-post='./index.php?task=validate&action=edit_description' hx-target='#validation_errors' value='<?= $poll->getDescrip(); ?>'>
</div>
<div class='flex flex-row items-center border-2 border-violet-800 rounded-md mt-4'>
<div class='text-lg p-2 pl-2 pr-2 bg-purple-300 border-r-2 border-violet-800 text-center'>Poll Last Updated</div>
<div class='text-lg p-2 pl-2 pr-2 w-[50vw] bg-slate-200 rounded-md'><?= $polldata['updated']; ?></div>
<div class='flex flex-row items-center border-2 border-violet-800 rounded-lg mt-4'>
<div class='text-lg p-2 pl-2 pr-2 bg-purple-300 border-r-2 border-violet-800 text-center font-bold rounded-l-lg'>Poll Last Updated</div>
<div class='text-lg p-2 pl-2 pr-2 w-[50vw] bg-slate-200 rounded-r-lg'><?= $poll->getUpdatedPrint(); ?></div>
</div>
</div>
<div class='mt-4 flex-col text-center'>
<?php
if (isset($questions) && count($questions) > 0) {
foreach ($questions as $question) {
echo $question->edit();
createQuestion($data, $question);
}
} else {
?>
<div class='mt-4 mb-4'>
<div class='mt-4 mb-4 border-purple-600 bg-slate-400 border-2 rounded-lg p-4'>
<div id='question_container'>
<div class='font-bold text-xl mb-2'>There are no questions for this poll yet.</div>
<button class='text-lg p-2 pl-2 pr-2 bg-blue-100 border-2 border-violet-800 rounded-lg' hx-get='./index.php?task=createquestion' hx-target='#question_container' hx-swap='innerHTML'>Create Question</button>
<div class='font-bold text-xl mb-2 bg-slate-100 rounded-lg p-1'>There are no questions for this poll yet.</div>
<button class='font-bold text-lg p-2 pl-2 pr-2 bg-blue-100 border-2 border-violet-800 rounded-lg' hx-get='./index.php?task=createquestion' hx-target='#question_container' hx-swap='innerHTML'>Create Question</button>
</div>
</div>
<?php
@ -465,7 +590,8 @@ function beginEdit($id)
?>
</div>
<div>
<input class='<?= cancel(); ?>' type="button" value="Cancel" hx-post='./index.php' hx-target='#primary_container' hx-swap='outerHTML' hx-push-url='/'>
<input class='<?= submitStyles(); ?> mr-2' type="button" value="Save" hx-post='./index.php' hx-target='#primary_container' hx-swap='outerHTML' hx-push-url="/index.php?task=edit&id=<?= $id ?>">
<input class='<?= cancelStyles(); ?>' type="button" value="Cancel" hx-post='./index.php' hx-target='#primary_container' hx-swap='outerHTML' hx-push-url='/'>
</div>
</div>
</form>
@ -473,33 +599,35 @@ function beginEdit($id)
<?php
}
function createQuestion($question_id)
function createQuestion(DataInterface $data)
{
$question_id = $question_id + 1;
if ($question_id == 1) {
?>
<div id='question<?= $question_id; ?>'>
<div class='flex flex-row items-center border-2 border-violet-800 rounded-md mt-2 mb-2'>
<div class='text-lg p-2 pl-2 pr-2 bg-blue-300 border-r-2 border-violet-800'>Question <?= $question_id ?></div>
<input class='text-lg p-2 w-[40vw] bg-slate-100 rounded-md' type="text" name="question" id="question" hx-trigger='change' hx-post='./index.php?task=validate&action=create_question' hx-target='#validation_errors' value='' />
<div id='question<?= $question_id; ?>' class='border-2 border-violet-600 rounded-md mb-2 mt-2 text-lg p-2 bg-zinc-300'>
<div class='flex flex-row items-center border-2 border-violet-800 rounded-md'>
<div class='p-2 pl-2 pr-2 bg-blue-300 border-r-2 border-violet-800 font-bold'>Question <?= $question_id ?></div>
<input class='p-2 w-[40vw] bg-slate-100 rounded-md' type="text" name="question" id="question" hx-trigger='change' hx-post='./index.php?task=validate&action=question' hx-target='#validation_errors' value='' />
<div class='bg-red-600 h-full p-2 pl-4 pr-4 mr-[.2em] rounded-lg text-white'>X</div>
</div>
<div class='flex flex-row items-center border- border-violet-800 rounded-md mt-2 mb-2'>
<div>A thing!</div>
</div>
<button class='text-lg p-2 pl-2 pr-2 bg-blue-100 border-2 border-violet-800 rounded-lg' hx-get='./index.php?task=createquestion' hx-target='#question_container' hx-swap='afterbefore'>Create Question</button>
</div>
<button class='text-lg p-2 pl-2 pr-2 bg-blue-100 border-2 border-violet-800 rounded-lg font-bold' hx-get='./index.php?task=createquestion' hx-target='#question_container' hx-swap='afterbefore'>Add Question</button>
<?php
}
function createAnswer($current_max_id) {
?>
<div class='flex flex-row items-center border-2 border-violet-800 rounded-md text-lg ml-4'>
<div class='p-2 pl-2 pr-4 bg-sky-300 border-r-2 border-violet-800 font-bold'>Answer <?= $answer_id ?></div>
<input class='p-2 w-[40vw] bg-slate-100 rounded-md' type="text" name="question" id="question" hx-trigger='change' hx-post='./index.php?task=validate&action=answer' hx-target='#validation_errors' value='' />
</div>
<?php
}
}
function endEdit($id)
function endEdit($data, $id)
{
$db_conn = new SQLite3('qs36f.db');
$db = new DBConnector($db_conn);
$sql = "UPDATE polls SET descrip = '" . $_POST['descrip'] . "', updated = '" . date('YmdHis') . "' WHERE id = " . $id;
if (!$result = $db->query($sql)) {
$db->doError(__FUNCTION__, $sql);
$db->doError('', __FUNCTION__, $sql);
}
?>
<div id="primary_container">
@ -515,3 +643,6 @@ function endEdit($id)
</div>
<?php
}
// https://omega.obu.edu/info/p3/sfshoppingsheet.php?id=081111&token=88ba0dafebde58c457d6453872da34590cb6b4aae00b968f37cec3607872dfb3
// https://omega.obu.edu/info/p3/sfshoppingsheet.php?id=081111&token=88ba0dafebde58c457d6453872da34590cb6b4aae00b968f37cec3607872dfb3

@ -517,16 +517,12 @@ video {
visibility: hidden;
}
.m-2 {
margin: 0.5rem;
}
.m-4 {
margin: 1rem;
}
.m-8 {
margin: 2rem;
.m-2 {
margin: 0.5rem;
}
.mt-2 {
@ -541,14 +537,6 @@ video {
margin-bottom: 1rem;
}
.ml-2 {
margin-left: 0.5rem;
}
.ml-4 {
margin-left: 1rem;
}
.mt-4 {
margin-top: 1rem;
}
@ -557,12 +545,16 @@ video {
margin-right: .2em;
}
.flex {
display: flex;
.ml-4 {
margin-left: 1rem;
}
.hidden {
display: none;
.mr-2 {
margin-right: 0.5rem;
}
.flex {
display: flex;
}
.h-12 {
@ -573,31 +565,6 @@ video {
height: 100%;
}
.w-24 {
width: 6rem;
}
.w-44 {
width: 11rem;
}
.w-min {
width: -moz-min-content;
width: min-content;
}
.w-40 {
width: 10rem;
}
.w-80 {
width: 20rem;
}
.w-\[40vw\] {
width: 40vw;
}
.w-\[50vw\] {
width: 50vw;
}
@ -611,24 +578,16 @@ video {
width: 100%;
}
.w-\[vw-90\] {
width: vw-90;
}
.w-\[60vw\] {
width: 60vw;
}
.w-8 {
width: 2rem;
.w-44 {
width: 11rem;
}
.w-\[15\%\] {
width: 15%;
}
.origin-center {
transform-origin: center;
.w-\[40vw\] {
width: 40vw;
}
.cursor-pointer {
@ -643,10 +602,6 @@ video {
flex-direction: column;
}
.content-center {
align-content: center;
}
.items-center {
align-items: center;
}
@ -655,37 +610,36 @@ video {
justify-content: center;
}
.gap-2 {
gap: 0.5rem;
}
.self-center {
align-self: center;
.rounded-md {
border-radius: 0.375rem;
}
.rounded-full {
border-radius: 9999px;
}
.rounded {
border-radius: 0.25rem;
.rounded-lg {
border-radius: 0.5rem;
}
.rounded-sm {
border-radius: 0.125rem;
.rounded-t-lg {
border-top-left-radius: 0.5rem;
border-top-right-radius: 0.5rem;
}
.rounded-md {
border-radius: 0.375rem;
.rounded-l-lg {
border-top-left-radius: 0.5rem;
border-bottom-left-radius: 0.5rem;
}
.rounded-lg {
border-radius: 0.5rem;
.rounded-b-lg {
border-bottom-right-radius: 0.5rem;
border-bottom-left-radius: 0.5rem;
}
.rounded-t-none {
border-top-left-radius: 0px;
border-top-right-radius: 0px;
.rounded-r-lg {
border-top-right-radius: 0.5rem;
border-bottom-right-radius: 0.5rem;
}
.border-2 {
@ -696,24 +650,24 @@ video {
border-right-width: 2px;
}
.border-violet-800 {
.border-red-500 {
--tw-border-opacity: 1;
border-color: rgb(91 33 182 / var(--tw-border-opacity));
border-color: rgb(239 68 68 / var(--tw-border-opacity));
}
.border-purple-800 {
.border-purple-700 {
--tw-border-opacity: 1;
border-color: rgb(107 33 168 / var(--tw-border-opacity));
border-color: rgb(126 34 206 / var(--tw-border-opacity));
}
.border-red-800 {
.border-purple-800 {
--tw-border-opacity: 1;
border-color: rgb(153 27 27 / var(--tw-border-opacity));
border-color: rgb(107 33 168 / var(--tw-border-opacity));
}
.border-slate-800 {
.border-violet-800 {
--tw-border-opacity: 1;
border-color: rgb(30 41 59 / var(--tw-border-opacity));
border-color: rgb(91 33 182 / var(--tw-border-opacity));
}
.border-slate-200 {
@ -721,49 +675,24 @@ video {
border-color: rgb(226 232 240 / var(--tw-border-opacity));
}
.border-red-500 {
.border-violet-600 {
--tw-border-opacity: 1;
border-color: rgb(239 68 68 / var(--tw-border-opacity));
border-color: rgb(124 58 237 / var(--tw-border-opacity));
}
.border-purple-200 {
.border-purple-100 {
--tw-border-opacity: 1;
border-color: rgb(233 213 255 / var(--tw-border-opacity));
border-color: rgb(243 232 255 / var(--tw-border-opacity));
}
.border-purple-700 {
.border-purple-600 {
--tw-border-opacity: 1;
border-color: rgb(126 34 206 / var(--tw-border-opacity));
}
.border-green-800 {
--tw-border-opacity: 1;
border-color: rgb(22 101 52 / var(--tw-border-opacity));
}
.bg-slate-600 {
--tw-bg-opacity: 1;
background-color: rgb(71 85 105 / var(--tw-bg-opacity));
border-color: rgb(147 51 234 / var(--tw-border-opacity));
}
.bg-purple-700 {
--tw-bg-opacity: 1;
background-color: rgb(126 34 206 / var(--tw-bg-opacity));
}
.bg-sky-300 {
--tw-bg-opacity: 1;
background-color: rgb(125 211 252 / var(--tw-bg-opacity));
}
.bg-sky-100 {
--tw-bg-opacity: 1;
background-color: rgb(224 242 254 / var(--tw-bg-opacity));
}
.bg-sky-200 {
.bg-zinc-700 {
--tw-bg-opacity: 1;
background-color: rgb(186 230 253 / var(--tw-bg-opacity));
background-color: rgb(63 63 70 / var(--tw-bg-opacity));
}
.bg-slate-100 {
@ -771,44 +700,44 @@ video {
background-color: rgb(241 245 249 / var(--tw-bg-opacity));
}
.bg-purple-400 {
.bg-purple-100 {
--tw-bg-opacity: 1;
background-color: rgb(192 132 252 / var(--tw-bg-opacity));
background-color: rgb(243 232 255 / var(--tw-bg-opacity));
}
.bg-purple-300 {
.bg-slate-600 {
--tw-bg-opacity: 1;
background-color: rgb(216 180 254 / var(--tw-bg-opacity));
background-color: rgb(71 85 105 / var(--tw-bg-opacity));
}
.bg-purple-200 {
.bg-purple-900 {
--tw-bg-opacity: 1;
background-color: rgb(233 213 255 / var(--tw-bg-opacity));
background-color: rgb(88 28 135 / var(--tw-bg-opacity));
}
.bg-purple-600 {
.bg-slate-200 {
--tw-bg-opacity: 1;
background-color: rgb(147 51 234 / var(--tw-bg-opacity));
background-color: rgb(226 232 240 / var(--tw-bg-opacity));
}
.bg-purple-800 {
.bg-blue-100 {
--tw-bg-opacity: 1;
background-color: rgb(107 33 168 / var(--tw-bg-opacity));
background-color: rgb(219 234 254 / var(--tw-bg-opacity));
}
.bg-purple-900 {
.bg-blue-200 {
--tw-bg-opacity: 1;
background-color: rgb(88 28 135 / var(--tw-bg-opacity));
background-color: rgb(191 219 254 / var(--tw-bg-opacity));
}
.bg-red-900 {
.bg-purple-300 {
--tw-bg-opacity: 1;
background-color: rgb(127 29 29 / var(--tw-bg-opacity));
background-color: rgb(216 180 254 / var(--tw-bg-opacity));
}
.bg-red-500 {
.bg-blue-300 {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
background-color: rgb(147 197 253 / var(--tw-bg-opacity));
}
.bg-red-600 {
@ -816,64 +745,60 @@ video {
background-color: rgb(220 38 38 / var(--tw-bg-opacity));
}
.bg-zinc-700 {
.bg-sky-100 {
--tw-bg-opacity: 1;
background-color: rgb(63 63 70 / var(--tw-bg-opacity));
background-color: rgb(224 242 254 / var(--tw-bg-opacity));
}
.bg-zinc-800 {
.bg-sky-300 {
--tw-bg-opacity: 1;
background-color: rgb(39 39 42 / var(--tw-bg-opacity));
background-color: rgb(125 211 252 / var(--tw-bg-opacity));
}
.bg-zinc-600 {
.bg-zinc-200 {
--tw-bg-opacity: 1;
background-color: rgb(82 82 91 / var(--tw-bg-opacity));
background-color: rgb(228 228 231 / var(--tw-bg-opacity));
}
.bg-purple-100 {
.bg-zinc-300 {
--tw-bg-opacity: 1;
background-color: rgb(243 232 255 / var(--tw-bg-opacity));
background-color: rgb(212 212 216 / var(--tw-bg-opacity));
}
.bg-green-100 {
.bg-purple-800 {
--tw-bg-opacity: 1;
background-color: rgb(220 252 231 / var(--tw-bg-opacity));
background-color: rgb(107 33 168 / var(--tw-bg-opacity));
}
.bg-blue-100 {
.bg-slate-300 {
--tw-bg-opacity: 1;
background-color: rgb(219 234 254 / var(--tw-bg-opacity));
background-color: rgb(203 213 225 / var(--tw-bg-opacity));
}
.bg-red-300 {
.bg-slate-400 {
--tw-bg-opacity: 1;
background-color: rgb(252 165 165 / var(--tw-bg-opacity));
background-color: rgb(148 163 184 / var(--tw-bg-opacity));
}
.bg-blue-300 {
.bg-purple-400 {
--tw-bg-opacity: 1;
background-color: rgb(147 197 253 / var(--tw-bg-opacity));
background-color: rgb(192 132 252 / var(--tw-bg-opacity));
}
.bg-green-300 {
--tw-bg-opacity: 1;
background-color: rgb(134 239 172 / var(--tw-bg-opacity));
.p-2 {
padding: 0.5rem;
}
.bg-blue-200 {
--tw-bg-opacity: 1;
background-color: rgb(191 219 254 / var(--tw-bg-opacity));
.p-8 {
padding: 2rem;
}
.bg-slate-300 {
--tw-bg-opacity: 1;
background-color: rgb(203 213 225 / var(--tw-bg-opacity));
.p-1 {
padding: 0.25rem;
}
.bg-slate-200 {
--tw-bg-opacity: 1;
background-color: rgb(226 232 240 / var(--tw-bg-opacity));
.p-3 {
padding: 0.75rem;
}
.p-12 {
@ -884,28 +809,12 @@ video {
padding: 1rem;
}
.p-2 {
padding: 0.5rem;
}
.p-1 {
padding: 0.25rem;
}
.p-3 {
padding: 0.75rem;
}
.p-8 {
padding: 2rem;
}
.pl-2 {
padding-left: 0.5rem;
.pb-4 {
padding-bottom: 1rem;
}
.pr-2 {
padding-right: 0.5rem;
.pt-4 {
padding-top: 1rem;
}
.pl-4 {
@ -916,51 +825,26 @@ video {
padding-right: 1rem;
}
.pb-4 {
padding-bottom: 1rem;
}
.pl-8 {
padding-left: 2rem;
}
.pr-8 {
padding-right: 2rem;
}
.pt-2 {
padding-top: 0.5rem;
}
.pt-4 {
padding-top: 1rem;
.pl-6 {
padding-left: 1.5rem;
}
.pr-6 {
padding-right: 1.5rem;
}
.pl-6 {
padding-left: 1.5rem;
}
.pl-3 {
padding-left: 0.75rem;
.pl-2 {
padding-left: 0.5rem;
}
.pr-3 {
padding-right: 0.75rem;
.pr-2 {
padding-right: 0.5rem;
}
.text-center {
text-align: center;
}
.text-2xl {
font-size: 1.5rem;
line-height: 2rem;
}
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
@ -971,6 +855,11 @@ video {
line-height: 1.75rem;
}
.text-2xl {
font-size: 1.5rem;
line-height: 2rem;
}
.text-xl {
font-size: 1.25rem;
line-height: 1.75rem;
@ -980,11 +869,6 @@ video {
font-weight: 700;
}
.text-purple-800 {
--tw-text-opacity: 1;
color: rgb(107 33 168 / var(--tw-text-opacity));
}
.text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
@ -1000,6 +884,11 @@ video {
color: rgb(0 0 0 / var(--tw-text-opacity));
}
.text-yellow-200 {
--tw-text-opacity: 1;
color: rgb(254 240 138 / var(--tw-text-opacity));
}
.hover\:border-purple-200:hover {
--tw-border-opacity: 1;
border-color: rgb(233 213 255 / var(--tw-border-opacity));
@ -1010,111 +899,27 @@ video {
border-color: rgb(254 202 202 / var(--tw-border-opacity));
}
.hover\:bg-sky-200:hover {
--tw-bg-opacity: 1;
background-color: rgb(186 230 253 / var(--tw-bg-opacity));
}
.hover\:bg-slate-200:hover {
--tw-bg-opacity: 1;
background-color: rgb(226 232 240 / var(--tw-bg-opacity));
}
.hover\:bg-slate-300:hover {
--tw-bg-opacity: 1;
background-color: rgb(203 213 225 / var(--tw-bg-opacity));
}
.hover\:bg-slate-700:hover {
--tw-bg-opacity: 1;
background-color: rgb(51 65 85 / var(--tw-bg-opacity));
}
.hover\:bg-green-800:hover {
--tw-bg-opacity: 1;
background-color: rgb(22 101 52 / var(--tw-bg-opacity));
}
.hover\:bg-green-600:hover {
--tw-bg-opacity: 1;
background-color: rgb(22 163 74 / var(--tw-bg-opacity));
}
.hover\:bg-green-500:hover {
--tw-bg-opacity: 1;
background-color: rgb(34 197 94 / var(--tw-bg-opacity));
}
.hover\:bg-orange-500:hover {
--tw-bg-opacity: 1;
background-color: rgb(249 115 22 / var(--tw-bg-opacity));
}
.hover\:bg-orange-200:hover {
--tw-bg-opacity: 1;
background-color: rgb(254 215 170 / var(--tw-bg-opacity));
}
.hover\:bg-purple-200:hover {
--tw-bg-opacity: 1;
background-color: rgb(233 213 255 / var(--tw-bg-opacity));
}
.hover\:bg-purple-800:hover {
--tw-bg-opacity: 1;
background-color: rgb(107 33 168 / var(--tw-bg-opacity));
}
.hover\:bg-purple-400:hover {
--tw-bg-opacity: 1;
background-color: rgb(192 132 252 / var(--tw-bg-opacity));
}
.hover\:bg-purple-600:hover {
--tw-bg-opacity: 1;
background-color: rgb(147 51 234 / var(--tw-bg-opacity));
}
.hover\:bg-purple-500:hover {
--tw-bg-opacity: 1;
background-color: rgb(168 85 247 / var(--tw-bg-opacity));
}
.hover\:bg-red-600:hover {
--tw-bg-opacity: 1;
background-color: rgb(220 38 38 / var(--tw-bg-opacity));
}
.hover\:bg-slate-600:hover {
--tw-bg-opacity: 1;
background-color: rgb(71 85 105 / var(--tw-bg-opacity));
}
.hover\:bg-slate-500:hover {
--tw-bg-opacity: 1;
background-color: rgb(100 116 139 / var(--tw-bg-opacity));
}
.hover\:bg-red-500:hover {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.hover\:text-white:hover {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.hover\:text-black:hover {
--tw-text-opacity: 1;
color: rgb(0 0 0 / var(--tw-text-opacity));
}
.active\:border-2:active {
border-width: 2px;
}
.active\:border-yellow-500:active {
--tw-border-opacity: 1;
border-color: rgb(234 179 8 / var(--tw-border-opacity));
}

Binary file not shown.
Loading…
Cancel
Save