Skip to content

Commit

Permalink
Merge pull request #113 from eduardconstantin/fix/responsive-layout
Browse files Browse the repository at this point in the history
Fix/responsive layout
  • Loading branch information
eduardconstantin authored Mar 29, 2024
2 parents f72e8ec + 5da4e4b commit 818cc20
Show file tree
Hide file tree
Showing 4 changed files with 8 additions and 8 deletions.
2 changes: 1 addition & 1 deletion app/exam/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ const Exam: NextPage<{ searchParams: { url: string; name: string } }> = ({
const numberOfQuestions = data.randomQuestions.length || 0;

return (
<div className="py-10 px-5 mb-6 mx-auto w-5/6 sm:w-1/2 bg-slate-800 border-2 border-slate-700 rounded-lg">
<div className="py-10 px-5 mb-6 mx-auto w-[90vw] lg:w-[60vw] 2xl:w-[45%] bg-slate-800 border-2 border-slate-700 rounded-lg">
<div>
<div className="px-2 sm:px-10 w-full flex flex-row justify-between items-center">
<p className="text-white font-bold text-sm sm:text-2xl">
Expand Down
8 changes: 4 additions & 4 deletions app/modes/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,15 @@ const Modes: NextPage<{ searchParams: { url: string; name: string } }> = ({
const { url, name } = searchParams;

return (
<div className="mx-auto mb-6 w-5/6 sm:w-2/3 lg:w-2/3 xl:w-2/4 text-center">
<div className="mx-auto mb-6 w-full md:w-[90vw] lg:w-[70vw] 2xl:w-[45%] text-center">
<h2 className="text-white text-4xl text-leading font-bold uppercase md:mt-14">
{name}
</h2>
<p className="text-white text-lg mt-4 mb-14 px-5 leading-6">
Test your knowledge under pressure with our timed exam mode, or explore
and master over 480 questions at your own pace with our practice mode.
Test your knowledge under pressure with our timed exam mode or explore
and master all the questions at your own pace with our practice mode.
</p>
<div className="flex max-sm:flex-col max-sm:align-center justify-center gap-10 sm:mx-16">
<div className="flex max-sm:flex-col max-sm:align-center justify-center gap-10 mx-5 md:mx-16">
<ExamLink
href={{
pathname: "/practice",
Expand Down
4 changes: 2 additions & 2 deletions app/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,14 @@ import exams from "@azure-fundamentals/lib/exams.json";

const Home: NextPage = () => {
return (
<div className="mx-auto mb-6 w-5/6 sm:w-2/3 lg:w-2/3 xl:w-2/4 text-center">
<div className="mx-auto mb-6 w-full lg:w-[70vw] 2xl:w-[45%] text-center">
<h2 className="text-white text-5xl text-leading font-bold uppercase md:mt-14">
Welcome!
</h2>
<p className="text-white text-lg mt-4 mb-14 px-5 leading-6">
Select a Microsoft Azure exam from the list bellow.
</p>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-x-10 gap-y-5 sm:mx-16">
<div className="grid grid-cols-1 sm:grid-cols-2 gap-x-10 gap-y-5 mx-5 lg:mx-0">
{exams.map((exam) => {
return (
<NameLink
Expand Down
2 changes: 1 addition & 1 deletion app/practice/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ const Practice: NextPage<{ searchParams: { url: string; name: string } }> = ({
if (questionsError) return <p>Oh no... {questionsError.message}</p>;

return (
<div className="py-10 px-5 mb-6 sm:p-10 mx-auto w-5/6 sm:w-1/2 bg-slate-800 border-2 border-slate-700 rounded-lg">
<div className="py-10 px-5 mb-6 sm:p-10 mx-auto w-[90vw] lg:w-[60vw] 2xl:w-[45%] bg-slate-800 border-2 border-slate-700 rounded-lg">
<QuizForm
isLoading={loading || questionsLoading}
questionSet={data?.questionById}
Expand Down

0 comments on commit 818cc20

Please sign in to comment.