feat: repeating dynamic testimonial section
This commit is contained in:
efim
parent
951d364380
commit
657d7c7407
@ -1,40 +0,0 @@
|
||||
package testimonialsgrid;
|
||||
|
||||
public class JTestimonial {
|
||||
private String author;
|
||||
private String text;
|
||||
private int age;
|
||||
|
||||
// Constructor
|
||||
public JTestimonial(String author, String text, int age) {
|
||||
this.author = author;
|
||||
this.text = text;
|
||||
this.age = age;
|
||||
}
|
||||
|
||||
// Getters
|
||||
public String getAuthor() {
|
||||
return author;
|
||||
}
|
||||
|
||||
public String getText() {
|
||||
return text;
|
||||
}
|
||||
|
||||
public int getAge() {
|
||||
return age;
|
||||
}
|
||||
|
||||
// Setters
|
||||
public void setAuthor(String author) {
|
||||
this.author = author;
|
||||
}
|
||||
|
||||
public void setText(String text) {
|
||||
this.text = text;
|
||||
}
|
||||
|
||||
public void setAge(int age) {
|
||||
this.age = age;
|
||||
}
|
||||
}
|
||||
@ -32,27 +32,36 @@
|
||||
</style>
|
||||
</head>
|
||||
<body >
|
||||
<div class="py-20 px-7 space-y-7 text-white bg-light-grayish-blue">
|
||||
<div class="py-20 px-7 space-y-7 h-screen text-white bg-light-grayish-blue">
|
||||
<section
|
||||
class="py-7 px-10 space-y-4 rounded-xl bg-moderate-violet first:bg-[url('../public/images/bg-pattern-quotation.svg')] bg-no-repeat bg-[right_2rem_top] drop-shadow"
|
||||
th:each="testimonial : ${testimonials}"
|
||||
th:classappend="${testimonial.additionalClasses}"
|
||||
class="py-7 px-10 space-y-4 rounded-xl first:bg-[url('../public/images/bg-pattern-quotation.svg')] bg-no-repeat bg-[right_2rem_top] drop-shadow bg-moderate-violet"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
<img
|
||||
alt="Avatar image"
|
||||
src="../../../../public/images/image-daniel.jpg"
|
||||
th:src="${testimonial.avatarUrl}"
|
||||
class="mr-5 w-10 h-10 rounded-full border-2 border-gray-400"
|
||||
/>
|
||||
<div class="grow">
|
||||
<h1>Daniel Clifford</h1>
|
||||
<h1
|
||||
th:text="${testimonial.author}"
|
||||
>Daniel Clifford</h1>
|
||||
<p class="text-sm opacity-50">Verified Graduate</p>
|
||||
</div>
|
||||
</div>
|
||||
<h2 class="text-2xl">
|
||||
<h2 class="text-2xl"
|
||||
th:text="${testimonial.header}"
|
||||
>
|
||||
I received a job offer mid-course, and the subjects I learned were
|
||||
current, if not more so, in the company I joined. I honestly feel I
|
||||
got every penny’s worth.
|
||||
</h2>
|
||||
<p class="opacity-[70%] pb-2">
|
||||
<p class="opacity-[70%] pb-2"
|
||||
th:text="${testimonial.text}"
|
||||
>
|
||||
“ I was an EMT for many years before I joined the bootcamp. I’ve been
|
||||
looking to make a transition and have heard some people who had an
|
||||
amazing experience here. I signed up for the free intro course and
|
||||
@ -64,6 +73,7 @@
|
||||
</section>
|
||||
|
||||
<section
|
||||
th:remove="all"
|
||||
class="py-7 px-10 space-y-4 rounded-xl bg-very-dark-grayish-blue first:bg-[url('../public/images/bg-pattern-quotation.svg')] bg-no-repeat bg-[right_2rem_top] drop-shadow"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
@ -87,6 +97,7 @@
|
||||
</p>
|
||||
</section>
|
||||
<section
|
||||
th:remove="all"
|
||||
class="py-7 px-10 space-y-4 rounded-xl bg-white text-very-dark-blackish-blue first:bg-[url('../public/images/bg-pattern-quotation.svg')] bg-no-repeat bg-[right_2rem_top] drop-shadow"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
@ -107,6 +118,7 @@
|
||||
</p>
|
||||
</section>
|
||||
<section
|
||||
th:remove="all"
|
||||
class="py-7 px-10 space-y-4 rounded-xl bg-very-dark-blackish-blue text-white first:bg-[url('../public/images/bg-pattern-quotation.svg')] bg-no-repeat bg-[right_2rem_top] drop-shadow"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
@ -136,6 +148,7 @@
|
||||
</section>
|
||||
|
||||
<section
|
||||
th:remove="all"
|
||||
class="py-7 px-10 space-y-4 rounded-xl bg-white text-very-dark-blackish-blue first:bg-[url('../public/images/bg-pattern-quotation.svg')] bg-no-repeat bg-[right_2rem_top] drop-shadow"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
|
||||
@ -6,6 +6,7 @@ import cask.main.Routes
|
||||
import org.thymeleaf.context.Context
|
||||
import org.thymeleaf.templateresolver.ClassLoaderTemplateResolver
|
||||
import org.thymeleaf.TemplateEngine
|
||||
import scala.beans.BeanProperty
|
||||
|
||||
import scala.jdk.CollectionConverters._
|
||||
|
||||
@ -45,51 +46,34 @@ object Main {
|
||||
def index() = {
|
||||
val context = new Context()
|
||||
|
||||
import scala.beans.BeanProperty
|
||||
final case class Testimonial(
|
||||
@BeanProperty var avatarUrl: String,
|
||||
@BeanProperty var author: String,
|
||||
@BeanProperty var header: String,
|
||||
@BeanProperty var text: String,
|
||||
@BeanProperty var age: Int
|
||||
@BeanProperty var age: Int,
|
||||
@BeanProperty var additionalClasses: String
|
||||
)
|
||||
|
||||
class CompatTestimonial {
|
||||
@BeanProperty var author: String = _
|
||||
@BeanProperty var text: String = _
|
||||
@BeanProperty var age: Int = _
|
||||
|
||||
// Auxiliary constructor
|
||||
def this(author: String, text: String, age: Int) = {
|
||||
this() // Call to the primary constructor
|
||||
this.author = author
|
||||
this.text = text
|
||||
this.age = age
|
||||
}
|
||||
}
|
||||
val yo = new CompatTestimonial("Leopold", "Miawu", 188)
|
||||
// val yo = Testimonial("Leopold", "Miawu", 188)
|
||||
|
||||
// let's experiment. ugh
|
||||
class Person(
|
||||
@BeanProperty var firstName: String,
|
||||
@BeanProperty var lastName: String,
|
||||
@BeanProperty var age: Int
|
||||
) {
|
||||
override def toString: String =
|
||||
return String.format("%s, %s, %d", firstName, lastName, age)
|
||||
}
|
||||
val p = new Person("Efim", "Nefedov", 31)
|
||||
println(p)
|
||||
// println(p.getFirstName)
|
||||
|
||||
val ugh = new JTestimonial("Hell", "lala", 1234)
|
||||
|
||||
context.setVariable("justString", "oh why oh why")
|
||||
context.setVariable("oneTestimonial", ugh)
|
||||
context.setVariable(
|
||||
"testimonials",
|
||||
List(
|
||||
new JTestimonial("Leopold", "Miawu", 91),
|
||||
new JTestimonial("Aragorn", "And my sword!", 55)
|
||||
new Testimonial(
|
||||
"public/images/image-patrick.jpg",
|
||||
"Leopold",
|
||||
" Odio facilisis mauris sit amet massa vitae tortor condimentum lacinia quis vel eros donec ac odio tempor orci dapibus ultrices. ",
|
||||
" Nibh sed pulvinar proin gravida hendrerit? Massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada proin libero nunc, consequat interdum varius sit amet, mattis vulputate enim nulla aliquet porttitor lacus! ",
|
||||
91,
|
||||
"!bg-red-500"
|
||||
),
|
||||
new Testimonial(
|
||||
"public/images/image-jonathan.jpg",
|
||||
"Aragorn",
|
||||
" Eleifend donec pretium vulputate sapien nec sagittis aliquam malesuada bibendum! ",
|
||||
" Egestas fringilla phasellus faucibus scelerisque eleifend! Dignissim enim, sit amet venenatis urna cursus eget nunc scelerisque viverra mauris, in aliquam sem fringilla ut morbi tincidunt augue interdum velit euismod in! ",
|
||||
55,
|
||||
"!bg-blue-500"
|
||||
)
|
||||
).asJava
|
||||
)
|
||||
val result = templateEngine.process("index", context)
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user