diff options
Diffstat (limited to 'src/screens/student/Classroom/AssignmentsTab/styles.js')
-rw-r--r-- | src/screens/student/Classroom/AssignmentsTab/styles.js | 134 |
1 files changed, 134 insertions, 0 deletions
diff --git a/src/screens/student/Classroom/AssignmentsTab/styles.js b/src/screens/student/Classroom/AssignmentsTab/styles.js new file mode 100644 index 0000000..8c97bd3 --- /dev/null +++ b/src/screens/student/Classroom/AssignmentsTab/styles.js @@ -0,0 +1,134 @@ +// ========== Desktop ========== +const desktopExternalContainer = { + marginTop: '50px', + height: '100vh', +}; + +const desktopInnerContainer = { + width: '90%', + marginBottom: '30px', +}; + +const desktopSectionTitle = { + padding: '10px', + borderBottom: '2px solid #00420D', + color: '#00420D', +}; + +const desktopAssignmentContainer = { + width: '95%', + padding: '20px', + borderBottom: '2px solid #BCBCBC', +}; + +const desktopAssignmentTypography = {}; + +const desktopAssignmentLink = { + color: 'black', + textDecoration: 'underline #000000', +}; + +const desktopAssignmentDueDate = { + marginTop: '15px', + fontSize: '15px', +}; + +const desktopAssignmentScores = { + fontSize: '15px', +}; + +const desktopEmptyStateContainer = { + display: 'flex', + justifyContent: 'center', + marginTop: '30px', +}; + +const desktop = { + externalContainer: desktopExternalContainer, + innerContainer: desktopInnerContainer, + sectionTitle: desktopSectionTitle, + assignmentContainer: desktopAssignmentContainer, + assignmentTypography: desktopAssignmentTypography, + assignmentLink: desktopAssignmentLink, + assignmentDueDate: desktopAssignmentDueDate, + assignmentScores: desktopAssignmentScores, + emptyStateContainer: desktopEmptyStateContainer, +}; + +// ========== Mobile ========== +const mobileExternalContainer = { + marginTop: '50px', + height: '100vh', +}; + +const mobileInnerContainer = { + width: '100%', + marginBottom: '30px', +}; + +const mobileSectionTitle = { + padding: '10px', + borderBottom: '2px solid #00420D', + color: '#00420D', +}; + +const mobileAssignmentContainer = { + width: '100%', + padding: '20px', + borderBottom: '2px solid #BCBCBC', +}; + +const mobileAssignmentTypography = { + overflow: 'hidden', + textOverflow: 'ellipsis', + display: '-webkit-box', + WebkitLineClamp: 2, + WebkitBoxOrient: 'vertical', +}; + +const mobileAssignmentLink = { + color: 'black', + textDecoration: 'underline #000000', +}; + +const mobileAssignmentDueDate = { + marginTop: '10px', + fontSize: '12px', +}; + +const mobileAssignmentScores = { + fontSize: '12px', +}; + +const mobileEmptyStateContainer = { + display: 'flex', + justifyContent: 'center', + marginTop: '30px', +}; + +const mobile = { + externalContainer: mobileExternalContainer, + innerContainer: mobileInnerContainer, + sectionTitle: mobileSectionTitle, + assignmentContainer: mobileAssignmentContainer, + assignmentTypography: mobileAssignmentTypography, + assignmentLink: mobileAssignmentLink, + assignmentDueDate: mobileAssignmentDueDate, + assignmentScores: mobileAssignmentScores, + emptyStateContainer: mobileEmptyStateContainer, +}; + +// ========== Unset ========== +const unset = { + externalContainer: null, + innerContainer: null, + sectionTitle: null, + assignmentContainer: null, + assignmentTypography: null, + assignmentLink: null, + assignmentDueDate: null, + assignmentScores: null, +}; + +const styles = { desktop, mobile, unset }; +export default styles; |